.html() corrupts variables

[anonymous]

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);
  }
}

[rwaldron]

If you replace the contents, the form is gone. If you have a reference, it will be updated to reflect that the form no longer exists - that's what it means to be a reference.

Please use the forum for support