1. 程式人生 > >jquery.validate 自定義驗證方法提交問題

jquery.validate 自定義驗證方法提交問題

需要引入jquery.form.js

自定義方法:

// 匹配english
jQuery.validator.addMethod(“isEnglish”, function(value, element) {
return this.optional(element) || /^[A-Za-z]+$/.test(value);
}, “匹配english”);

提交:

var FormValidation = function () {

return {
    //main function to initiate the module
    init: function () {

        // for more info visit the official plugin documentation: 
        // http://docs.jquery.com/Plugins/Validation

        var form1 = $('#fromAddOrEdit');
        var error1 = $('.alert-danger', form1);
        var success1 = $('.alert-success', form1);         

       form1.validate({
            errorElement: 'span', //default input error message container
            errorClass: 'help-block', // default input error message class
            focusInvalid: false, // do not focus the last invalid input
            ignore: "",
            rules: {
                name: {
                    maxlength:200,
                    required: true,
                    remote:"existName.do"
                },
                roleid: {
                    maxlength:200,
                    required: true,
                    alnum: true,
                },
                description: {
                    maxlength:200,
                    required: true,
                },
                yhm: {
                    maxlength:200,
                    required: true
                },
                password:{
                    required: true,
                    maxlength:25
                },
                password2:{
                    required: true,
                    maxlength:25,
                    equalTo:"#password" 
                }

            }, 
            messages: { // custom messages 
                name: {                     
                    required: "請輸入登入名",
                    remote: "該登入名已存在"
                },
                yhm: {                      
                    required: "請輸入使用者名稱"
                },
                roleid: {
                    alnum: "請輸入正確的字母"
                },
                password: {
                    required: "請輸入登入密碼"
                },
                password2: {
                    required: "請輸入確認密碼",
                    equalTo: "兩次密碼不一致"
                }
            },
            invalidHandler: function (event, validator) { //display error alert on form submit 
                success1.hide();
                $('.alert-danger span.sei-form-message').text("請檢查下列輸入問題。");                               
                error1.show();
            },
            highlight: function (element) { // hightlight error inputs
                $(element)
                    .closest('.form-group').addClass('has-error'); // set error class to the control group
            },

            unhighlight: function (element) { // revert the change done by hightlight
                $(element)
                    .closest('.form-group').removeClass('has-error'); // set error class to the control group
            },

            success: function (label) {
                label
                    .closest('.form-group').removeClass('has-error'); // set success class to the control group
            },

            submitHandler: function (form) {
                success1.show();
                error1.hide();  
                fromAddOrEdit.submit();
            }
        });
    }

};

}();