jQuery 验证jquery后提交表单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8638641/
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
submit form after validation jquery
提问by DigitalWhirl LLC
I have following form:
我有以下表格：
<form id="form" action="comments.php" method="post">
<ul>
<li><div class="formbox_titles">Name</div><input type="text" name="name" class="required comm_input" /></li>
<li><div class="formbox_titles">Email</div><input type="text" name="email" class="required comm_input"/></li>
<li><div class="formbox_titles">Message</div><textarea name="message" class="required comm_text"></textarea></li>
<li><input type="submit" value="Submit"></li>
</ul>
</form>
and following JQuery for form submission:
并遵循 JQuery 进行表单提交：
target: '#preview',
success: function() {
$('#formbox').slideUp('fast');
}
Now the problem is that I also have form validation JQuery code
现在的问题是我也有表单验证 JQuery 代码
$().ready(function() {
// validate comment form
$("#form").validate({
});
});
Both of them work great and form does popup warning that all three fields cant be empty but the date inside form is submitted into database anyway. Im using following code for form validation http://bassistance.de/jquery-plugins/jquery-plugin-validation/So the question is how to add first jquery inside second, so first will be executed once the required fields are filled?
它们都很好用，并且表单会弹出警告，所有三个字段都不能为空，但表单中的日期无论如何都会提交到数据库中。我使用以下代码进行表单验证http://bassistance.de/jquery-plugins/jquery-plugin-validation/所以问题是如何在第二个中添加第一个 jquery，所以一旦填写了必填字段，第一个将被执行？
Hope someone will help. Thanks.
希望有人会帮忙。谢谢。
回答by Abbas
From your example, I am not clear about the control flow of your page, however, I am assuming you are calling the submit()method somewhere. After you have validated the form and before you submit it, check it's validation with the valid()method. Your code should look something like this:
从您的示例中，我不清楚您的页面的控制流，但是，我假设您正在submit()某处调用该方法。在验证表单之后和提交之前，请使用该valid()方法检查它的验证。您的代码应如下所示：
$("#form").validate();
if ($('#form').valid())
$('#form').submit();
回答by Francisco Goldenstein
If you want to submit the form manually, you have to bypass jQuery bound event. You can do it in either of these ways:
如果要手动提交表单，则必须绕过 jQuery 绑定事件。您可以通过以下任一方式进行操作：
$('#form_id')[0].submit();
or
或者
$('#form_id').get(0).submit();
[0] or get(0) gives you the DOM object instead of the jQuery object.
[0] 或 get(0) 为您提供 DOM 对象而不是 jQuery 对象。
回答by Grrbrr404
I do not know anything about your validation plugin, but normally u could use this peace of code
我对你的验证插件一无所知，但通常你可以使用这种代码的和平
<script>
$("form").submit(function() {
if (validationIsTrue()) {
return true;
}
else {
return false;
}
});
</script>
You have to make your validation and then return true / false to the submit function of the form. If the plugin does return a bool value, you can try something like this:
您必须进行验证，然后将 true / false 返回到表单的提交功能。如果插件确实返回 bool 值，您可以尝试以下操作：
$("form").submit(function() {
return $(this).validate({ .... });
});
回答by kasdega
When you say that the "date inside form is submitted" that makes no sense to me because in your code snippets I see nothing called "date".
当您说“提交表单内的日期”对我来说毫无意义时，因为在您的代码片段中我看不到任何称为“日期”的内容。
I've used the .validate() plugin extensively... What I can tell you that may help is that the validate plugin you're using has a submitHandler function that you can use...
我已经广泛使用了 .validate() 插件......我可以告诉你的可能有帮助的是，你正在使用的验证插件有一个 submitHandler 功能，你可以使用......
// validate comment form
$("#form").validate({
submitHandler : function(form) {
//do something here
form.submit();
}
});
The submitHandler is called only if all the rules for validation are met. Namely in your case you have three fields with "required" on them which means that this form will NOT be submitted unless all three fields have a value.
仅当满足所有验证规则时才调用 submitHandler。也就是说，在您的情况下，您有三个带有“必填”的字段，这意味着除非所有三个字段都有值，否则不会提交此表单。
With that, I can tell you for sure that with the information provided there is nothing to indicate the problem you're describing. Providing more and better information will help us figure out what's wrong.
有了这个，我可以肯定地告诉你，根据所提供的信息，没有任何东西可以表明你所描述的问题。提供更多更好的信息将帮助我们找出问题所在。
回答by Raju
You can use submitHandler from JQuery form validate plugin
您可以使用 JQuery 表单验证插件中的 submitHandler
<script type="text/javascript" src="resources/jquery.min.js" ></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script type='text/javascript'>
$(document).ready(function() {
$(".form").validate({
rules: {
userName: {
required: true
},
password: {
required: true
}
},
messages: {
userName: {
required: "specify userName"
},
password: {
required: "specify password"
}
},
errorClass: "help-inline text-danger",
errorElement: "span",
highlight: function(element, errorClass, validClass) {
$(element).parents('.form-group').addClass('has-error');
},
unhighlight: function(element, errorClass, validClass) {
$(element).parents('.form-group').removeClass('has-error');
$(element).parents('.form-group').addClass('has-success');
},
submitHandler: function(form,e) {
e.preventDefault();
console.log('Form submitted');
$.ajax({
type: 'POST',
url: 'authenticate.jsp',
dataType: "html",
data: $('form').serialize(),
success: function(result) {
window.location.href = "dashboard.jsp";
},
error : function(error) {
}
});
return false;
}
});
});
</script>
