Carven Carven - 14 days ago 5
Javascript Question

Preventing a form from submitting in jQuery Validate plugin's submitHandler function

I am using jQuery with the validate plugin at http://docs.jquery.com/Plugins/Validation/validate

I want to prevent the form from submitting after its validation and submission processes done via ajax.
I have the following code:

$("#myform").validate({
rules: {...},
submitHandler: function(form) {
alert("Do some stuff...");
//submit via ajax
return false; //This doesn't prevent the form from submitting.
}
});


However, the problem with this is that the
submitHandler
submits the form even though I have a
return false;
statement at the last line of the handling function. I want prevent the default behaviour and to stop the form from submitting because I have already submitted via ajax.

How should I stop the code from submitting after going through the ajax codes in the
submitHandler
function?

Answer

I do it like this and it works exactly how you want it to work:

$("#myform").submit(function(e) {
    e.preventDefault();
}).validate({
    rules: {...},
    submitHandler: function(form) { 
        alert("Do some stuff...");
        //submit via ajax
        return false;  //This doesn't prevent the form from submitting.
    }
});
Comments