I have a very complex form and I store the form data in a jQuery object. Then I replace the form with a loading symbol using the .html() method on the form. After the .html() call, the form variable data losses some of it's data. I have seen this issue consistently when calling ajaxSubmit from the jQuery.forms library immediately after displaying the loading symbol. I thought that it might be a jQuery.forms issue, but I have seen this same issue using the codeMirror library (not a jQuery plugin) from codemirror.net. With code mirror, some (not all) of my specialized text areas in the form are lost.

Here is an example of the .html method corrupting my form before an ajaxSubmit. Commenting out the .html() method call fixes the problem. Note: my form has file inputs within it.

postFileForm: function($form, element, $hostObject) {
  $("#dialog-form").html("<div class='loading'><img src='ajax-loader.gif' /> Loading...</div>");
  try {
    $form.ajaxSubmit({
      iframe: true,
      type: 'POST',
      success: function(responseText, statusText, xhr, $form1) {
        DialogUtility.fillFormResults(responseText, $hostObject, element);
      },
      error : function(XMLHttpRequest, textStatus, errorThrown) {
        alert(errorThrown);
      },
      beforeSubmit: function(formData, jqForm, options) {}
    });
  } catch(ex) {
    alert(ex);
  }
}