jQuery 验证插件 + equalTo 不工作
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/2887292/
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
jQuery Validation Plugin + equalTo Not Working
提问by Tom Winchester
Here is what I am currently using to attempt to validate a form. When I press submit with no values entered into the form, I get the error messages for each of the inputs as expected. However, no matter what I put in newpassword2 or newemail2 they never 'pass' validation. I've tried everything from copy and paste to making them one letter each to no success. Perhaps I am not using the equalTo attribute correctly...
这是我目前用来尝试验证表单的内容。当我在没有在表单中输入任何值的情况下按下提交时,我会按预期收到每个输入的错误消息。但是,无论我在 newpassword2 或 newemail2 中输入什么,它们都不会“通过”验证。我已经尝试了从复制和粘贴到使每个字母一个字母的所有方法,但都没有成功。也许我没有正确使用 equalTo 属性......
I've also verified that all the names of the selectors agree with the input id's on the form. Also, all of the inputs are contained within the form, so there aren't any outside of the form tags (I read that was an issue with someone else).
我还验证了选择器的所有名称都与表单上的输入 ID 一致。此外,所有输入都包含在表单中,因此表单标签之外没有任何内容(我读到这是其他人的问题)。
$(document).ready(function() {
$("#account_data").validate({
rules: {
newpassword1: { required: true },
newpassword2: { equalTo: "#newpassword1" },
newemail1: { required: true, email: true },
newemail2: { equalTo: "#newemail1" }
}
});
});
Any help would be extremely appreciated!
任何帮助将不胜感激!
THANK YOU!!!
谢谢你!!!
-Tom-
-汤姆-
回答by Dexter
If you will use id="password" it won't work. You must use another name for id.
如果您将使用 id="password" 它将不起作用。您必须为 id 使用另一个名称。
All keys in the rules object refer to the input.name
and not input.id
规则对象中的所有键都引用了input.name
而不是input.id
回答by John Magnolia
When using the equalTo you have to use the form name and ID. E.g:
使用 equalTo 时,您必须使用表单名称和 ID。例如:
<input type="password" name="password" id="password" value="" />
<input type="password" name="password_mirror" value="" />
$("#register_user").validate({
rules: {
'password_mirror': {
minlength: 5,
equalTo: "#password"
}
},
messages: {
'password_mirror': {
minlength: "Your password must be at least 5 characters long",
equalTo: "Please enter the same password as above"
}
}
});
回答by Sudhanshu Dev
Before using "equalTo" we need to take care of following points:
在使用“equalTo”之前,我们需要注意以下几点:
Use different word for input element name and id.
Use input element id in "equalTo" match instead of input element name:
对输入元素名称和 id 使用不同的词。
在“equalTo”匹配中使用输入元素 id 而不是输入元素名称:
<html>
<head>
<title></title>
<script src="jquery-1.12.0.min.js"></script>
<script src="jquery.validate.min.js"></script>
<script>
$(document).ready(function(){
$('#btnSubmit').click(function(){
$("form").validate({
rules: {
pwd: {
required: true,
minlength : 6
},
conf_pwd: {
required: true,
minlength : 6,
equalTo: "#id_pwd"
}
},
messages: {
pwd: {
required: "Please enter the password.",
minlength: "Your password must be at least 6 characters long"
},
conf_pwd: {
required: "Please enter the confirm password.",
minlength: "Your password must be at least 6 characters long",
equalTo: "Please enter the same password as above"
}
},
submitHandler: function(form) {
form.submit();
}
});
});
});
</script>
</head>
<body>
<div>
<form id="data" action="" method="post">
<div class="form-group row">
<label>Password:</label>
<div>
<input id="id_pwd" name="pwd" type="password" />
</div>
</div>
<div>
<label>Confirm Password:</label>
<div>
<input id="id_conf_pwd" name="conf_pwd" type="password" />
</div>
</div>
<div>
<div>
<div>
<input type="submit" id="btnSubmit" name="submit" value="Reset Password">
</div>
</div>
</div>
</form>
</div>
</body>
</html>
回答by Greg
I had the same problem as Tom. The solution was to create an id for the password fields that matched the names for the password fields. (As mentioned by Tom). Definitely a bug in the validation code, because it should just rely on the name field. Oh well...
我和汤姆有同样的问题。解决方案是为密码字段创建一个与密码字段名称匹配的 id。(正如汤姆所提到的)。肯定是验证代码中的一个错误,因为它应该只依赖于名称字段。那好吧...
-Greg
-格雷格
回答by ACP
@Tom try
@汤姆试试
newpassword1: { required: true },
newpassword2: { required: true,equalTo: "#newpassword1"},
newemail1: { required: true, email: true },
newemail2: { required: true,email: true ,equalTo: "#newemail1" }
or use the latest version of validation plugin
或使用最新版本的验证插件
Now rules have added with password being required set to true and the second condition is for password_again set to required true and it has to “equalTo” the input field with id of password. With these conditions set, we are able to achieve what we are wanting. Do not forget to check the demo of the post to see how it works. For more documentation and resource on this plugin visit jQuery Validation Plugin
现在规则已经添加,密码需要设置为true,第二个条件是password_again 设置为required true,它必须“等于”输入字段的密码id。有了这些条件,我们就能够实现我们想要的。不要忘记检查帖子的演示以了解它是如何工作的。有关此插件的更多文档和资源,请访问 jQuery 验证插件