Can we use use some common rules for multiple validator functions using Jquery Validator Plugin

Question

I would like to use some common rules for two different validator functions. But all the rules are not same. Is there any way that I can write a common code for removing duplicate code.

Here is the sample code,

//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
}

As you can see, there are some common rules and error handling functions written in both functions. Is there any way to write them in one place and call it in validator method?

Thanks in advance..

You have not shown us code for custom rules, `max_length_100`, `max_length_20`, `max_length_10`, etc. But if you take advantage of the parameter argument, you can replace these with a single `max_length` rule that defines the length when you declare the rule: `max_length: 100`, `max_length: 20`, `max_length: 10`, etc. — Sparky, Aug 29 '16 at 14:26
To answer your original question, yes, you can define common rules for both using various techniques as described here: http://stackoverflow.com/a/9056425/594235 — Sparky, Aug 29 '16 at 14:29
Hi @Sparky, thanks for the answer.. is there any way to write the error handlers in the same way? — glider, Aug 30 '16 at 04:53

Can we use use some common rules for multiple validator functions using Jquery Validator Plugin

0 Answers0