CODEWITHSUNDEEP
jqueryjquery-validate
Valeklosse
Valeklosse

Reputation: 1017

jQuery Validate Re-initialize

I have a situation where a form needs to be validated before submitting. Im currently using the jQuery validate plugin. However depending on a radio button value it only needs to validate certain fields.

I thought being able to reinitialize the validate plugin would work however when calling the .valid on the form it doesn't validate the additional fields.

This is my jQuery for the validate initialization.

var minVal = function () {
    $("#user-details-form").validate({
        errorClass: "text-danger",
        rules: {
            DeliveryFirstname: { required: true },
            DeliverySurname: { required: true },
            DeliveryCompanyName: { required: true },
            DeliveryPostcode: { required: true, postcodeUK: true },
            DeliveryAddress1: { required: true },
            DeliveryCity: { required: true },
            EmailAddress: { required: true, email: true },
            Telephone: { required: true }
        },
        messages: {
            DeliveryFirstname: { required: "First name required" },
            DeliverySurname: { required: "Last name required" },
            DeliveryCompanyName: { required: "Company name required" },
            DeliveryPostcode: { required: "Postcode required", postcodeUk: "Invalid postcode" },
            DeliveryAddress1: { required: "First line of address required" },
            DeliveryCity: { required: "City required" },
            EmailAddress: { required: "Email address required", email: "Invalid email address" },
            Telephone: { required: "Telephone number required" }
        }
    });
};

var maxVal = function () {
    $("#user-details-form").validate({
        errorClass: "text-danger",
        rules: {
            DeliveryFirstname: { required: true },
            DeliverySurname: { required: true },
            DeliveryCompanyName: { required: true },
            DeliveryPostcode: { required: true, postcodeUK: true },
            DeliveryAddress1: { required: true },
            DeliveryCity: { required: true },
            InvoiceFirstname: { required: true },
            InvoiceSurname: { required: true },
            InvoiceCompanyName: { required: true },
            InvoicePostcode: { required: true, postcodeUK: true },
            InvoiceAddress1: { required: true },
            InvoiceCity: { required: true },
            EmailAddress: { required: true, email: true },
            Telephone: { required: true }
        },
        messages: {
            DeliveryFirstname: { required: "First name required" },
            DeliverySurname: { required: "Last name required" },
            DeliveryCompanyName: { required: "Company name required" },
            DeliveryPostcode: { required: "Postcode required", postcodeUk: "Invalid postcode" },
            DeliveryAddress1: { required: "First line of address required" },
            DeliveryCity: { required: "City required" },
            InvoiceFirstname: { required: true },
            InvoiceSurname: { required: true },
            InvoiceCompanyName: { required: true },
            InvoicePostcode: { required: true, postcodeUK: true },
            InvoiceAddress1: { required: true },
            InvoiceCity: { required: true },
            EmailAddress: { required: "Email address required", email: "Invalid email address" },
            Telephone: { required: "Telephone number required" }
        }
    });
};

And this is the radio button change method (for reference)

$('input[name="IsInvoiceAddress"]:radio').on("change", function () {
    var b = ($(this).val().toLowerCase() === "true");
    if (!b) {
        console.log("max val");
        maxVal();
    } else {
        console.log("min val");
        minVal();
    }
});

I understand that I could simply add/remove the additional rules for each element. using the .rules({}) syntax. But wondering if there is a way to reinitialize the validate plugin on the form.

Upvotes: 0

Views: 5408

Answers (1)

Sparky
Sparky

Reputation: 98738

I understand that I could simply add/remove the additional rules for each element. using the .rules({}) syntax. But wondering if there is a way to reinitialize the validate plugin on the form.

No. There is no method for reinitializing the plugin. .validate() is the initialization method and it only gets called once on the form. All subsequent calls are always ignored.

The .valid() method is used to programmatically force a validation test at any time.

The main point of the developer giving you the .rules() method is so that rules can be changed without the worry of re-initialization.

Upvotes: 1

Related Questions