Question

我正在尝试使用jQuery验证插件1.8.0（和JQuery 1.5.2）设置远程验证。

它适用于“required”和“maxlength”但远程验证仅在第二次单击（验证）之后，或者之前已触发任何其他错误。

验证正确执行并显示错误消息但第一次验证返回true（即使显示错误）。这是一个问题，因为表单将提交错误。

这是我的代码（简化）：

<script type="text/javascript">
    $(function() {
         $( "#check" ).click(function(){
            var valid = $("#myForm").validate(
                 {rules: {
                       groupName:{
                            required:true,
                            maxlength:40,
                            remote: {
                                url: 'ajaxCheck.php', // returns always a dummy string: "Simulate an error message" (JSON encoded)
                                type: "post",
                                data: {
                                    groupName: function() {
                                            return $("#groupName").val()
                                    }
                                }
                            }
                        }

                    }
                }
            ).form();
            alert(valid); // Returns true at the first call, and then false
        });
    });
</script>

<form id="myForm" action="">
   <label for="groupName">Group name</label>
   <input type="text" maxlength="40" size="45" value="my test" id="groupName" name="groupName">
</form>
<input type="button" value="Check form"   id="check" >

ajaxCheck.php包含：

require_once ('Zend/Json/Encoder.php');
echo Zend_Json_Encoder::encode("Simulate an error message");

JSON响应似乎已正确编码（使用Firebug进行检查）。

知道我做错了什么吗？

我也尝试过jQuery 1.6但在IE8上还有其他问题。

Answer 1

在使用返回值之前，您不是在等待验证。原因是验证需要ajax请求，而你不是在等待它。执行此操作的正确方法是在回调内验证后包含要运行的任何代码。在验证插件中，验证失败时会调用invalidHandler。您可以通过将其添加到传递给validate()的选项对象来使用它，如下所示：

$(function() {
         $( "#check" ).click(function(){
            var valid = $("#myForm").validate(
                 {rules: {
                       groupName:{
                            required:true,
                            maxlength:40,
                            remote: {
                                url: 'ajaxCheck.php', // returns always a dummy string: "Simulate an error message" (JSON encoded)
                                type: "post",
                                data: {
                                    groupName: function() {
                                            return $("#groupName").val()
                                    }
                                }
                            }
                        }
                    },
                    invalidHandler: function(form, validator){
                            alert('invalid input'); //note this is called ONLY IF validation fails
                    }
                }
            ).form();
        });
   });

验证插件有许多基于验证结果调用的回调。 Take a look at them here （点击“选项”并查找“回调”功能。）

jQuery远程验证仅在第二次单击时起作用

1 个答案: