jQuery Form Callback Compatibility Issue

Question

I have a form on my website (http://www.jakelazaroff.com/#contact) that I submit with jQuery. The callback function for when the form is successfully submitted is supposed to make the form fade away; however, for some reason this only works on certain browser/OS combinations. Right now, the compatibility list is as follows:

WORKS
o  firefox 3.0, xp
o  firefox 3.0.14, vista
o  firefox 3.0.15, vista
o  firefox 3.5.5, os 10.6.2
v  chrome 4.0.249.30, os 10.6.2
o  chrome 3.0.195.33, w7

DOESNT WORK
o  safari 4.0.4, os 10.6.2
o  safari 4.0.3, os 10.5.8
o  firefox 3.5.5, w7
o  firefox 3.5.5, os 10.5.8
o  chrome 3.0.195.33, vista

o = unreproduced, v = reproduced, x = conflicting

...which is an odd list (it works in Firefox 3.5.5 on Mac OS 10.6.2, but not in Firefox 3.5.5 on Mac Os 10.5.8?). The code I use to validate/submit the form, and the callback function, is the following:

// hide the form and display success message (called after form is submitted)
 function formHide() {

  // cache form wrapper and blurb
  var formWrapper = $("#contactForm");
  var formBlurb = $("#contact .formBlurb");

  // set the height of wrapper and blurb 
  formWrapper.height(formWrapper.height());
  formBlurb.height(formBlurb.height());

  // fade out required fields message, fade in success message
  formBlurb.find(".requiredFields").fadeOut("fast", function() {
   formBlurb.find(".thanks").fadeIn("fast");
  });

  // fade out form
  formWrapper.find("form").fadeOut("slow", function(){
   // slide up the div so there's no jump
   formWrapper.slideUp("slow");
  });
 }

 // cache the form
 var form = $("#contactForm form");

 // validate the form
 $("#contactForm form").validate({
  // when errors are made...
  errorPlacement: function() {
   // turn the background on those elements red
   $("#contactForm form .error").animate( { backgroundColor:"#ff6666" }, "fast" );
  },
  // when submitting the form...
  submitHandler:  function(form){
   $(form).ajaxSubmit({
    // use fm.pl as the submission script
    url: "cgi-bin/fm.pl",
    // hide the form if it's successful
    success: formHide
   });
  }
 });

The form plugin I use can be found at http://malsup.com/jquery/form/, and the validation plugin I use can be found at http://bassistance.de/jquery-plugins/jquery-plugin-validation/. Is there something I'm missing that is breaking compatibility?

Thanks :)

P.S. Sorry I didn't format the URLS of the plugins I'm using as links - I can't post more than one link until I have 10 reputation points.
P.P.S. Okay, posting this gave me 10 more reputation points, so the URLs of the plugins I'm using are now links.

Answer 1

Is it just the fade that doesnt work? These rows looks suspicious:

  formWrapper.height(formWrapper.height());
  formBlurb.height(formBlurb.height());

Whay are you trying to set a height that is already there?

Answer 2

The culprit seems to be the omission of parentheses in "success: formHide". I was under the impression that that was okay, but apparently it's not.