I created an event handler for a form, 'submit'. I then called submit() on that form and the event handler hit briefly and then submited the form despite the fact that the first line of my event handler was evt.preventDefault(). I found a fix but it was rather hackish.

More details: I had two files both loaded on the same page.

File 1:

$(document).ready(function() {

$('.myForms').live('submit', function (evt) {

evt.preventDefault();

//do more stuff

}

});

File 2:

$(document).ready(function () {

$('.myLink').live('click', function (evt) {

$(this).closest('form').submit();

});

});

The form in file 2 was one of the forms for which the sumbit handler in file 1 was registered. However the prevent default did not work.

I had to apply the following hack:

file 2:

$(document).ready(function () {

$('.myLink').live('click', function (evt) {

$(this).closest('form').bind('submit, function(evt) { evt.preventDefault(); }.submit();

});

});

In the case of my hack/fix, the event handler in file 2 was hit to prevent default on the submit event and then the event handler for submit in file 1 was hit and the form serialization and ajax that is performed by that function could go down.

Why was the one submit handler in file 1 not adequate?