2015年5月5日 星期二

jquery validate plugin

            $("#form1").validate({
                debug: true,
                rules: {
                    submitHandler: function (form1) {
                        $("#send").attr("disabled", true);
                        $("#d1").attr('class', "center disable");
                        form1.ajaxSubmit();
                    },
                    LOGIN_ID: {
                        required: true,
                        remote: {
                            url: "AccountAPI.aspx",
                            type: "POST",
                            dataType: "json",
                            data: {
                                uid: function () {
                                    return $("#LOGIN_ID").val();
                                },
                                API: "ismemberidavailable",

                            },
                            dataFilter: function (data) {
                                var x = (JSON.parse(data)).state;
                                if (x == "true") {
                                    return '"true"';
                                }
                                return "\"" + (JSON.parse(data)).msg + "\"";
                            },

                        }
                    },
                    Mobile: {
                        required: true,
                        //phcheck: true,
                        //remote: {
                        //    url: "AccountAPI.aspx",
                        //    type: "POST",
                        //    dataType: "json",
                        //    data: {
                        //        Mobile: function () {
                        //            return $("#combobox").val() + "-" + $("#Mobile").val();
                        //        },
                        //        API: "checkmobile",

                        //    },
                        //    dataFilter: function (data) {
                        //        var x = (JSON.parse(data)).state;
                        //        if (x == "true") {
                        //            return '"true"';
                        //        }
                        //        return "\"" + (JSON.parse(data)).msg + "\"";
                        //    },

                        //}
                    },
                    combobox: {
                        required: true,
                    },
                    EMail: {
                        required: true,
                        email: true,
                        remote: {
                            url: "AccountAPI.aspx",
                            type: "POST",
                            dataType: "json",
                            data: {
                                EMail: function () {
                                    return $("#EMail").val();
                                },
                                API: "checkemail",

                            },
                            dataFilter: function (data) {
                                var x = (JSON.parse(data)).state;
                                if (x.toLowerCase() == "true") {
                                    return '"true"';
                                }
                                return "\"" + (JSON.parse(data)).msg + "\"";
                            },

                        }
                    },
                    EMail2: {
                        required: true,
                        email: true,
                        equalTo: "#EMail",
                    },
                    Password: {
                        pwcheck: true,
                        required: true,
                    },
                    Password2: {
                        required: true,
                        pwcheck: true,
                        equalTo: "#Password",
                    }
                },
                messages: {
                    EMail2: {
                        equalTo: "信箱比對不一致",
                    },
                    Password2: {
                        equalTo: "密碼比對不一致",
                    }
                },
            });

            $.validator.addMethod("pwcheck", function (value) {
                return /^[A-Za-z0-9\d=!\-@._*]*$/.test(value) // consists of only these
                    && /[a-z]/.test(value) // has a lowercase letter
                    && /\d/.test(value) // has a digit
            }, jQuery.validator.format("至少包含英文跟數字"));

            $.validator.addMethod("phcheck", function (value) {
                return /^[09]{2}[0-9]{8}$/.test(value);
            }, jQuery.validator.format("電話格式錯誤"));

        });



  1. debug : 不往後端傳送。
  2. submitHandler: 驗證都成功時submit的情況。
  3. required: 是否必要。
  4. remote: 後端驗證,以ajax方式回傳,要傳入的參數以data傳遞,type=json,回傳參數只能傳true,否則不能正常顯示,解法用datafilter 過濾,正確無誤回傳true,錯誤的話回傳msg。
  5. equalTo: 驗證是否相同
  6. addMethod: 新增驗證格式



沒有留言:

張貼留言