validate input fields with finest technique using jquery

See more:

Javascript

jQuery

validation

, +

i have html form which include Five input text fields and one drop-down (select) field.

These text fields are showing in form with respect to drop-down options mean if i selected option 1 then three text fields will be showing and for option 2 ( 4 text fields ).

I am using jquery for hide and show these text field on drop-down change event. So now problem is that i want to validate these fields as these are showing mean if three three fields are showing then these are mendatory fields.

One solution to validate is that i have to define separate function for each drop-down option. So when dropdown change event trigger i would call these function according to name but i don't want to make separate functions.

function Vld_Option1() {

    $("#fmName").validate({
        rules: {
            FirstName:
            {
                required: true,
                accept: "[a-zA-Z]+"
            },
            LastName:
            {
                required: true,
                accept: "[a-zA-Z]+"
            },
            Loginname:
            {
                required: true,
                accept: "[a-zA-Z0-9]+"
            }
        },
        messages: {
            FirstName:
            {
                required: "Please provide first name",
                accept: "Name cannot be alphanumeric."
            },
            LastName:
            {
                required: "Please provide last name",
                accept: "Name cannot be alphanumeric."
            },
            Loginname:
            {
                required: "Please provide login name",
                accept: "Name cannot be alphanumeric."
            }
        }
    });
}

 function Vld_Option2() {

    $("#fmName").validate({
        rules: {
            FirstName:
            {
                required: true,
                accept: "[a-zA-Z]+"
            },

            Password:
            {
                required: true,
                minlength: 6
            },
            Email:
            {
                required: true,
                email: true
            },
            WorkingContactNo:
            {
                required: true,
                number: true
            }

        },
        messages: {
            FirstName:
            {
                required: "Please provide first name",
                accept: "Name cannot be alphanumeric."
            },

            Password:
            {
                required: "Please provide password",
                minlength: "Password should not be less than 6 characters"
            },
            Email:
            {
               required: "Please provide email",
                email: "Please provide valid email address"
            },
            WorkingContactNo:
            {
                 required: "Please provide contact number",
                number: "Letters are not allowed"
            }
        }
    });
}

I written these two functions. there is repetition of code but i don't want repetition and multiple functions. i have Ten options so i have to define Ten functions but fields are five which are hidden and visible.

How can i validate fields which are showing on page other fields should not mendatory.

Please suggest best technique to handle this issue

Thanks