我们可以使用Jquery Validator Plugin

时间:2016-08-25 13:25:50

标签: javascript jquery jquery-validate

我想对两个不同的验证器函数使用一些通用规则。但所有规则都不一样。有没有办法可以编写一个公共代码来删除重复的代码。

以下是示例代码

//validation rules for customer
function validate_customer()
{

    $('#form_maintain_customer').removeData('validator');
    $("#form_maintain_customer").validate({
        ignore: "",
        focusinvalid: false,
        invalidHandler: function(form, validator) {
        var errors = validator.numberOfInvalids();
        if (errors) {
                validator.errorList[0].element.focus();
                jQuery('html, body').animate({
          scrollTop: jQuery(validator.errorList[0].element).offset().top-200
    }, 500);
            }
        },
        rules: {
            field_id_1: {
                required: true,
                max_length_100: true,
                name_format: true,
            },
            field_id_2: {
                required: true,
                max_length_20: true,
                alphanumeric: true
            },
            field_id_3: {
                required: true,
            },
            field_id_4: {
                required: true,
                alphanumeric: true,
                max_length_250: true
            },
            field_id_5: {
                required: true,
                postcode: true,
                max_length_10: true
            },
        },
        errorClass:'has-error',
        validClass:'has-success',
        errorElement:'span',
        highlight: function (element, errorClass, validClass) {
            $(element).parents("div.form-group").addClass(errorClass).removeClass(validClass);
        },
        unhighlight: function (element, errorClass, validClass) {
            $(element).parents(".has-error").removeClass(errorClass).addClass(validClass);
        },
        errorPlacement: function(error, element) {
            if(!element.closest('form').hasClass('dont-show-error')) {
                error.addClass('help-block');
                if(element.parents('.input-group').length > 0) {
                    error.insertAfter(element.parents('.input-group'));
                } else if (element.attr("data-error-container")) { 
                    error.appendTo(element.attr("data-error-container"));
                } else {
                    error.insertAfter(element);
                }
            }
        }
    });

    var result = $("#form_maintain_customer").valid();
    return result
} 

// validation rules for admin
function validate_admin()
{

    $('#form_maintain_admin').removeData('validator');
    $("#form_maintain_admin").validate({
        ignore: "",
        focusinvalid: false,
        invalidHandler: function(form, validator) {
        var errors = validator.numberOfInvalids();
        if (errors) {
                validator.errorList[0].element.focus();
                jQuery('html, body').animate({
          scrollTop: jQuery(validator.errorList[0].element).offset().top-200
    }, 500);
            }
        },
        rules: {
            field_id_1: {
                required: true,
                max_length_100: true,
                name_format: true,
            },
            field_id_2: {
                required: true,
                max_length_20: true,
                alphanumeric: true
            },
            field_id_3: {
                required: true,
            },
            field_id_4: {
                alphanumeric: true,
                max_length_250: true
            },
            field_id_5: {
                required: true,
                postcode: true,
            },
        },
        errorClass:'has-error',
        validClass:'has-success',
        errorElement:'span',
        highlight: function (element, errorClass, validClass) {
            $(element).parents("div.form-group").addClass(errorClass).removeClass(validClass);
        },
        unhighlight: function (element, errorClass, validClass) {
            $(element).parents(".has-error").removeClass(errorClass).addClass(validClass);
        },
        errorPlacement: function(error, element) {
            if(!element.closest('form').hasClass('dont-show-error')) {
                error.addClass('help-block');
                if(element.parents('.input-group').length > 0) {
                    error.insertAfter(element.parents('.input-group'));
                } else if (element.attr("data-error-container")) { 
                    error.appendTo(element.attr("data-error-container"));
                } else {
                    error.insertAfter(element);
                }
            }
        }
    });

    var result = $("#form_maintain_admin").valid();
    return result
}

如您所见,这两个函数都编写了一些常用规则和错误处理函数。有没有办法在一个地方写它们并用验证方法调用它?

提前致谢..

0 个答案:

没有答案