使用jQuery验证器的valid（）或element（）方法和远程方法 [英] Using jQuery validator's valid() or element() method with remote methods
问题描述
jQuery validator valid（）方法（ http：// jqueryvalidation .org / valid ）检查所选表单是否有效或所有选定元素是否有效。
jQuery validator valid() method ( http://jqueryvalidation.org/valid) checks whether the selected form is valid or whether all selected elements are valid.
jQuery validator element（） 方法（ http://jqueryvalidation.org/Validator.element/ 验证单个元素，如果有效则返回true，否则返回false。
jQuery validator element() method (http://jqueryvalidation.org/Validator.element/) validates a single element, returns true if it is valid, false otherwise.
但是，对于远程方法，第一次检查表单时，两种方法都错误地指出元素通过验证。
With remote methods, however, the first time the form is checked, both methods incorrectly indicated that the element passes validation.
如何使用 valid（）或元素（ ）使用远程验证方法？
How can I use either valid() or element() with a remote validation method?
https ：//stackoverflow.com/a/3884995/1032531 提供了一个解决方案，但它与当前版本的jQuery Vali无法正常工作dator。 element（）不再返回 undefined ，而异步调用正在以 this.check（> checkElement）！== false （v1.13.1的第423行）只会返回 true 或 false 。因此，人们可以任意暂停100毫秒，但是没有检查这是否是正确的时间。
https://stackoverflow.com/a/3884995/1032531 provides a solution but it does not work properly with current versions of jQuery Validator. element() no longer returns undefined while the asynchronous call is running as this.check( checkElement ) !== false (line 423 of v1.13.1) will only return true or false. As such, one could arbitrarily pause 100 ms, but there is no check whether this is the correct amount of time.
顺便说一下，我提出这个问题的理由是我希望使用jQueryValidator进行内联编辑。 https://jsfiddle.net/vctt9utd/ 显示了除远程方法之外的工作示例。
By the way, my reason for asking this question is that I wish to use jQueryValidator with inline editing. https://jsfiddle.net/vctt9utd/ shows a working example except for remote methods.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Testing</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
var validator=$("#myForm").validate({
rules: {
bla: {
minlength:2,
maxlength:4,
required:true,
remote: "validate.php"
}
},
messages: {
bla: {
remote:"error message"
}
}
});
$('#testit').click(function(){
$('#bla').val('test');
console.log($('#bla').valid());
console.log(validator.element('#bla'));
})
});
</script>
</head>
<body>
<form id="myForm" method="post">
<input name="bla" id="bla" value="" readonly>
</form>
<button id="testit">testit</button>
</body>
</html>
推荐答案
有点黑客，但似乎有效。我不喜欢它如何启动两个ajax请求。我想我可以动态更改规则以从验证器的规则中删除远程方法，但是，我需要手动添加消息。从技术上来说，我的应用程序，我不需要显示消息，但我使用返回input.next（）。html（）; 来获取消息，如 https://jsfiddle.net/vctt9utd/ 。
Kind of a hack, but it seems to work. I don't like how it initiates two ajax requests. I suppose I could dynamically change the rules to remove the remote method from validator's rules, however, then I would need to manually add the message. Technically for my application, I don't need the message displayed, but am using return input.next().html(); to get the message as shown in https://jsfiddle.net/vctt9utd/.
<form id="myForm" method="post">
<input name="myelement" id="myelement" value="">
</form>
<button id="testit">testit</button>
var validator = $("#myForm").validate({
rules: {
myelement: {
minlength: 2,
maxlength: 4,
required: true,
remote: {
url: "/echo/html/",
type: "POST",
data: {
html: 0,
delay: .5
}
}
}
},
messages: {
myelement: {
remote: "error message"
}
}
});
$('#testit').click(function () {
if ($('#myelement').valid()) {
$.post("/echo/html/", {
html: 0,
delay: .5
}, function (status) {
if(!+status){alert('failed remote validation');}
});
}
else {alert('failed normal validation if first attempt, otherwise could be either.');}
})
这篇关于使用jQuery验证器的valid（）或element（）方法和远程方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
