在jQuery验证中添加方法答案

【问题标题】：add method in jquery validation在jQuery验证中添加方法
【发布时间】：2015-04-07 10:04:51
【问题描述】：

我正在通过 jquery 验证插件验证我的表单。我面临一个问题，我有一个查询。 fiddle

问题：我使用 addmethod 添加了自定义验证。它工作正常，但未显示相关消息。
查询：我必须检查用户输入的用户名是否存在。我在以 JSON 形式调用 ajax 后得到响应。例如

{"用户名":"存在"}

我制作了另一种客户验证方法。

 $.validator.addMethod("specialChar", function(value, element){      
  return response.username!="exist"
 },"{0} already exist");

我的问题是如何在 ajax 成功后触发此验证

【问题讨论】：

标签： javascript jquery ajax validation

【解决方案1】：

$('#myform').validate({
        onfocusout:function(element){           
            this.element(element)
        },
        rules:{
            username:{
                required:true,
                specialChar:true
            }
        },

        messages:{
            **"username": {
                required: "bhai ye required hai",
                specialChar: "bhai ye special bhe mat daal"

            }**


        }
    })

粗体是代码的变化

以及更新的小提琴：http://jsfiddle.net/61pptcb3/3/

【讨论】：

【解决方案2】：

我认为您最好使用special remote method。它允许您设置一个 ajax 请求来验证一个元素。它确实需要您对服务器设置进行一些小的更改，但它会使其余的变得容易得多。

【讨论】：

【解决方案3】：

$.validator.addMethod("specialChar", function (value, element, params) {
    var patt = new RegExp(/[^A-z]/g);
    return !patt.test(value);
});


$('#myform').validate({
    onfocusout: function (element) {
        this.element(element)
    },
    rules: {
        username: {
            required: true,
            specialChar: true
        }
    }
});

$.extend($.validator.messages, {
    required: "My own text.",
    specialChar: "special charactor not allow"
});

【讨论】：

【解决方案4】：

添加并显示一个 ajax-loader，同时用户输入用户名。当 jQuery ajax 调用返回时，隐藏 ajax-loader 图标并在用户不存在时显示消息。

要提供callback to jQuery.ajax，请使用：

jQuery.ajax(url, {complete: function(){}});

致validate the element when the ajax returns use：

$("#myform").validate().element("#i1");

把它放在一起这样做：

$.ajax(url, {complete: function(data){
     // truigger validation on ajax complete
     $("#myform").validate().element("#i1");
}});

【讨论】：

如果我们使用 $("#myform").validate().element("#i1")。将触发哪个验证
@amit，它应该触发该元素上添加的所有验证