Question

jQuery验证器valid()方法（http://jqueryvalidation.org/valid）检查所选表单是否有效或所有选定元素是否有效。

jQuery验证器element()方法（http://jqueryvalidation.org/Validator.element/）验证单个元素，如果有效则返回true，否则返回false。

但是，使用远程方法时，第一次检查表单时，两种方法都错误地指示元素通过验证。

如何使用远程验证方法使用valid()或element()？

https://stackoverflow.com/a/3884995/1032531提供了一个解决方案，但它对当前版本的jQuery Validator无法正常工作。当异步调用以element()（v1.13.1的第423行）运行时，undefined不再返回this.check( checkElement ) !== false，只会返回true或false。因此，可以任意暂停100毫秒，但不检查这是否是正确的时间。

顺便说一句，我提出这个问题的原因是我希望使用jQueryValidator进行内联编辑。 https://jsfiddle.net/vctt9utd/显示了除远程方法之外的工作示例。

<!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>

Answer 1

有点黑客，但似乎有效。我不喜欢它如何启动两个ajax请求。我想我可以动态更改规则以从验证器的规则中删除远程方法，但是，我需要手动添加消息。从技术上讲，对于我的应用程序，我不需要显示消息，而是使用return input.next().html();来获取消息，如https://jsfiddle.net/vctt9utd/所示。

http://jsfiddle.net/msprwad5/

<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（）方法和远程方法

1 个答案: