Question

Ok, I searched, but didn’t come up with my exact issue…

I load a jqModal with a hidden div that contains a contact form which posts to process page via $.ajax
All works fine. The response message displays in the modal box and user can then exit out of modal.

The issue is when the modal get’s re-triggered (without a parent page refresh), it displays the response text from the previous usage of the modal. I’d like to reload the hidden div on the parent page with the blank form.

$('.submitModal').click(function(e){
   e.preventDefault();
   $('form').hide(); 
   var pStartTime = $('#eventStartTime').val();
   var eventDataString = 'startTime='+pStartTime;
   $.ajax({
      type:"POST",
      url:"i_calendarAddEvent.php",
      data:eventDataString,
      success: function(responseText){
         $('.addEventTitle').html('Success. Event Added.');
         $('.showResponse').html(responseText);
      }
   });
});

I’ve tried adding a call to reset the form elements (in the $.ajax success function), but not sure if it works because the form in the hidden div never shows again.

function resetForm(formid) {
    $('#' + formid + ' :input').each(function(){ 
        $(this).val('').attr('checked',false).attr('selected',false);
    });
}

Thanks for any insights.

Answer 1

Hopefully you have found and answer by now 🙂 I recently ran in to a similar problem with an ajax post. Basically what was happening is that the ajax request was being cached. My solution was to add

$.ajaxSetup({ cache: false });

to my script file. Let me know if it works for your situation.