Javascript 防止表单在 jQuery Validate 插件的 submitHandler 函数中提交
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10798717/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Preventing a form from submitting in jQuery Validate plugin's submitHandler function
提问by Carven
I am using jQuery with the validate plugin at http://docs.jquery.com/Plugins/Validation/validate
我在http://docs.jquery.com/Plugins/Validation/validate 上使用带有验证插件的 jQuery
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 submitHandlersubmits 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即使我return false;在处理函数的最后一行有一个语句，它也会提交表单 。我想阻止默认行为并阻止表单提交，因为我已经通过 ajax 提交了。
How should I stop the code from submitting after going through the ajax codes in the submitHandlerfunction?
通过submitHandler函数中的ajax代码后，我应该如何阻止代码提交？
回答by Zoltan
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.
}
});
回答by pockiiie
$("#myform").validate({
rules: {...},
submitHandler: function(form, event) {
event.preventDefault();
alert("Do some stuff...");
//submit via ajax
}
});
Hope this help.
希望这有帮助。
回答by pilavust
Maybe you can validate externally without using a submit button:
也许您可以在不使用提交按钮的情况下进行外部验证：
if($("#myform").valid()){
alert("Do some stuff...");
}
回答by Gregory
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.
在那里您可以编写一个函数，该函数将在提交时执行。在文档中查找回调。
回答by VisioN
You can call event.preventDefault()on submitevent:
你可以叫event.preventDefault()上submit事件：
$("#myform").on("submit", function(event) {
event.preventDefault();
});
回答by Waqar Hussain
working fiddle
工作小提琴
according to jquery plugin validation document.
根据jquery插件验证文档。
submitHandler(default: native form submit)
submitHandler（默认：原生表单提交）
the submission method via submitHandlerbelow is quoted from documentationit should work , but it actually does not work they said that
通过submitHandler下面的提交方法引用自它应该工作的文档，但实际上不起作用他们说
Callback for handling the actual submit when the form is valid. Gets the formand the submit eventas the only arguments. Replaces the default submit. The right place to submit a form via Ajax after it is validated.
用于在表单有效时处理实际提交的回调。获取form和submit event作为唯一的参数。替换默认提交。在验证后通过 Ajax 提交表单的正确位置。
Example: Submits the form via Ajax, using jQuery Form plugin, when valid.
示例：当有效时，使用 jQuery Form 插件通过 Ajax 提交表单。
$("#myform").validate({
submitHandler: function(form,event) {
event.preventDefault();
$(form).ajaxSubmit();
}
});
i am writing code here what worked for me.
simply call your validayion plugin , and donot include submitHandlerin your validation function arguments.
我在这里写代码对我有用。只需调用您的 validayion 插件，并且不要包含submitHandler在您的验证函数参数中。
instead of submitting and preventing with submitHandleruse jQuery method of form submission. like below
而不是submitHandler使用 jQuery 表单提交方法提交和阻止。像下面
$("form").validate({});
$(document).on("submit", "form", function (event) {
event.preventDefault();
alert("submit");
});
回答by Adrian P.
I fixed this way. A patch for a jQuery Validation Plugin bug that it's not fixed even on v1.19.0
我是这样固定的。即使在 v1.19.0 上也未修复的 jQuery 验证插件错误的补丁
$('#save_edit_user').on('click', function () {
var isValid = $("#edit_user").validate().form() && $("#edit_user").validate().element("#edit_user_email");
//check current ajax call by $.active
//the form is not submitted before 0 ajax is running
if (isValid && $.active == 0){
// my save logic
}
});
回答by Miquel Adell
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 falsestatement like this:
不幸的是， call:submitHandler: function(form){似乎没有接受事件参数，所以似乎唯一的解决方案是这样的return false语句：
...
submitHandler: function(form) {
//your code
return false;
},
...
