防止表单提交到jQuery验证插件的submitHandler函数中。

时间:2021-12-07 09:37:33

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

我使用jQuery和验证插件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:

在通过ajax完成验证和提交过程之后,我希望阻止表单提交。我有以下代码:

$("#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.

但是,问题是submitHandler提交表单,即使我有一个返回false;处理函数最后一行的语句。我希望阻止默认行为,并阻止表单提交,因为我已经通过ajax提交了。

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

在submitHandler函数中检查了ajax代码之后,我应该如何阻止代码提交?

6 个解决方案

#1


41  

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

#2


21  

$("#myform").validate({
   rules: {...},
   submitHandler: function(form, event) { 
      event.preventDefault();
      alert("Do some stuff...");
      //submit via ajax
   }
});

Hope this help.

希望这个有帮助。

#3


2  

Maybe you can validate externally without using a submit button:

也许你可以不使用提交按钮进行外部验证:

if($("#myform").valid()){
    alert("Do some stuff...");
}

#4


1  

You can call event.preventDefault() on submit event:

您可以在提交事件时调用event. preventdefault ():

$("#myform").on("submit", function(event) {
    event.preventDefault();
});

#5


1  

You can code this in a very simple way via "jQuery Walidate". http://jquery.dop-trois.org/walidate/

您可以通过“jQuery Walidate”以非常简单的方式对其进行编码。http://jquery.dop-trois.org/walidate/

There you can code a function, that will be executed on submit. Look for Callback in the Documentation.

在那里,您可以编写一个函数,该函数将在提交时执行。在文档中查找回调。

#6


0  

unfortunately it seems that the call: submitHandler: function(form){ does not take an event argument so it seems that the only solution is a return false statement like this:

不幸的是,调用:submitHandler:函数(form){不接受事件参数,所以看起来唯一的解决方案是返回false语句:

...
submitHandler: function(form) {
    //your code
    return false;
},
...

#1


41  

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

#2


21  

$("#myform").validate({
   rules: {...},
   submitHandler: function(form, event) { 
      event.preventDefault();
      alert("Do some stuff...");
      //submit via ajax
   }
});

Hope this help.

希望这个有帮助。

#3


2  

Maybe you can validate externally without using a submit button:

也许你可以不使用提交按钮进行外部验证:

if($("#myform").valid()){
    alert("Do some stuff...");
}

#4


1  

You can call event.preventDefault() on submit event:

您可以在提交事件时调用event. preventdefault ():

$("#myform").on("submit", function(event) {
    event.preventDefault();
});

#5


1  

You can code this in a very simple way via "jQuery Walidate". http://jquery.dop-trois.org/walidate/

您可以通过“jQuery Walidate”以非常简单的方式对其进行编码。http://jquery.dop-trois.org/walidate/

There you can code a function, that will be executed on submit. Look for Callback in the Documentation.

在那里,您可以编写一个函数,该函数将在提交时执行。在文档中查找回调。

#6


0  

unfortunately it seems that the call: submitHandler: function(form){ does not take an event argument so it seems that the only solution is a return false statement like this:

不幸的是,调用:submitHandler:函数(form){不接受事件参数,所以看起来唯一的解决方案是返回false语句:

...
submitHandler: function(form) {
    //your code
    return false;
},
...