CODEWITHSUNDEEP
jqueryjquery-validate
Divesh Salian
Divesh Salian

Reputation: 1457

dynamically adding conditional validation using jquery validator

I wanted to add conditional rules dynamically on the page load here is my code what I have tried I have created jsfiddle First code sample

 $("input[name$='DistanceToRespondingFireDept']").rules("add", {
        required: {
            depends: function (element) {
                return $("input:radio[name='DistanceToNearestFireHydrnt']:checked").val() == 'U';
            }
        },
        messages: {
            required: "Tested"
        }
    });

second code

$("input[name$='DistanceToRespondingFireDept']").rules("add", {
        required: function (element) {
            return $("input:radio[name='DistanceToNearestFireHydrnt']:checked").val() == 'U';
        },
        messages: {
            required: "Tested"
        }
    });

I get an error "cannot call method call of undefined"

If I don't add any conditions do just simple required: true it works

Any suggestion how to fix

Upvotes: 1

Views: 1790

Answers (1)

Sparky
Sparky

Reputation: 98718

You have a syntax error.

The opening brace, {, was missing from here...

if (test === "a") { // <-- this opening brace was missing

Your DEMO: http://jsfiddle.net/TYbS5/4/

You should also update your jQuery Validate plugin to version 1.11.1, which is currently the latest.

And finally, both of your buttons are type="submit" which means the plugin will think they're both for submitting the form. You should change the "CLEAR" button into type="button" in order to prevent the plugin from capturing its click event.

EDIT:

As per comments, here is code for conditional validation...

required: function() {
    return $('#DistanceToNearestFireHydrnt1').is(':checked');
},

Working DEMO: http://jsfiddle.net/TYbS5/5/

Upvotes: 1

Related Questions