jQuery.validator.addMethod自訂驗證

標籤：func   optional   resolved   date   method   letter   方式   傳遞參數   名稱   

jQuery.validator.addMethod("numOrLetter", function(value, element) {
return this.optional(element) || /^[0-9|A-Z|a-z]+$/.test(value);
}, "請輸入數字或字母");

$("#inputForm").validate({
    rules : {
        //要校正的表單名稱
        operationCode : {
            //自訂的校正規則
            numOrLetter:true,
            //ajax校正,通過後台服務校正使用者所輸內容是否已在資料庫中存在,後台服務只需要返回true或false即可,boolean類型,String類型都可
             remote:{
                //這裡通過get方式,參數放在Url後,剛開始?後寫了operationCode=,請求發送後,url變成?operationCode=&operationCode=value
                //所以就去掉了
                url:"${ctx}/operation/operation/validateCode?" + $("#operationCode").val(),
                type:"GET",
                dataType:"json"
                //POST方式時,可以通過
                //data:{paramName:value,...}傳遞參數
            }
        }
    },
    messages:{
        operationCode:{
            //這裡指定出錯資訊
            remote:"指定的編號已存在"
        }
    }
});

ajax校正,可以使用內建的remote,也可以通過addMethod()添加

jQuery.validator.addMethod("checkUnique", function(value, element) {
    var deferred = $.Deferred();//建立一個延遲物件
    $.ajax({
        url:"${ctx}/operation/operation/listJson?operationCode="+value,
        async:false,//要指定不能非同步,必須等待後台服務校正完成再執行後續代碼
        dataType:"json",
        success:function(page) {
            var len = page.rows.length;
            if (len > 0) {
                deferred.reject();
            } else {
                deferred.resolve();   
            }
        }
    });
    //deferred.state()有3個狀態:pending:還未結束,rejected:失敗,resolved:成功
    return deferred.state() == "resolved" ? true : false;
}, "編號已存在");

通過addMethod()添加的ajax校正比remote的好處:
remote()請求的服務返回結果必須為boolean或String類型的 true或false,這樣要校正的話,後台必須添加這樣的服務
addMethod(),使用$.ajax()就可以在success中對服務返回的資料進行處理判斷來,這樣就把背景工作(返回true,false)轉到前台了

jQuery.validator.addMethod自訂驗證