[英]check if form validation is true
Hello i have a form that i want to run through form validation and then submit. 您好我有一个表单,我想通过表单验证运行,然后提交。 How can i check if the following function returns true to know that everything has been validated and then submitted?
如何检查以下函数是否返回true以了解所有内容是否已经过验证然后提交?
http://jsfiddle.net/WHGq2/ http://jsfiddle.net/WHGq2/
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<script type="text/javascript">
$(function(){
$("#form").validate({
debug: false,
rules: {
name: "required",
email: {
required: true,
email: true
},
phone: {
equired: true,
phone: true
}
},
messages: {
name: "Please let us know who you are.",
email: "A valid email will help us get in touch with you.",
phone: "Please provide a valid phone number.",
}
})
$('#form').submit(function(e){
// Stop the form actually posting
e.preventDefault();
// I want to be able to do the check here if the form has passed validation
if( $(this).valid() ) {
// Stop the form actually posting
// Send the request
$.post('/submit.php', {
name: $('#name').val(),
email: $('#email').val(),
phone: $('#phone').val(),
message: $('#message').val()
}, function(d){
alert("Thank you for submitting your request someone will contact your shortly.");
});
}
});
});
</script>
You can call the valid() method of jquery validation. 您可以调用jquery验证的valid()方法。 Like
喜欢
if($('#form').valid())
Actually you can declare the validate function when the html page is loaded and just check whether it's valid or not at the time of submit 实际上你可以在加载html页面时声明validate函数,并在提交时检查它是否有效
$(document).ready(function(){
$('#form').validate(rules...messages...);
In case of rules & messages use:- 如果使用规则和消息: -
rules: {
name: {
required: true
},
email: {
required: true,
email: true
},
phone: {
required: true,
phone: true }
},
messages: {
name: { required : "Please let us know who you are."},
email: {required : "A valid email will help us get in touch with you.",email : "A valid email will help us get in touch with you."},
phone: {required:"Please provide a valid phone number.",phone:"Please provide a valid phone number."}
}
It's a good practice and in case of phone numbers, you've misspelled required 这是一个很好的做法,如果是电话号码,你需要拼写错误
$('#form').submit(function(evt) {
evt.preventDefault();
.....
if( $('#form').valid() ) {
//submit the form via ajax
} else {
//show errors
}
});
});
And I think you know than you've to add the name attribute of each input field:- 我想你知道要添加每个输入字段的name属性: -
<input type="text" name="email" />
Please note that required
in the phone
rule was written equired
and could have caused most of your issues . 请注意,
required
在phone
规则写equired
并可能造成你的大部分问题 。 See the demo included. 参见附带的演示。
$(function() {
$('#form').validate(.......);
$('#form').submit(function(e) {
e.preventDefault();
.....
if( $(this).valid() ) {
//submit the form via ajax or otherwise
} else {
//report errors
}
});
});
You can use valid
method of the plugin, something like following. 您可以使用插件的
valid
方法,如下所示。
$('#form').validate({...});
if ($('#form').valid()) {
// do your thing
}
here is the documentation http://jqueryvalidation.org/valid 这里是文档http://jqueryvalidation.org/valid
Updated your code, added submitHandler ,Callback for handling the actual submit when the form is valid. 更新了您的代码,添加了submitHandler ,Callback以在表单有效时处理实际提交。
<script type="text/javascript">
$(function(){
$('#form').submit(function(e){
$("#form").validate({
debug: false,
rules: {
name: "required",
email: {
required: true,
email: true
},
phone: {
equired: true,
phone: true
}
},
messages: {
name: "Please let us know who you are.",
email: "A valid email will help us get in touch with you.",
phone: "Please provide a valid phone number.",
},
submitHandler: function() {
// Stop the form actually posting
e.preventDefault();
// Send the request
$.post('/submit.php', {
name: $('#name').val(),
email: $('#email').val(),
phone: $('#phone').val(),
message: $('#message').val()
}, function(d){
alert("Thank you for submitting your request someone will contact your shortly.");
});
}
});
});
});
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.