JQuery validate - Assigning Rules as variable

Question

Am specifying rules in the below format

rules :{ 
col1: { 
required: true
},
col2: {
maxlength: 50
}
}

which completely works fine. Is it possible to assign it to the variable and add it to rules like below format

var testRules = "{ col1: { required: true},col2: {maxlength: 50}}";

rules : testRules

The above code didnt worked am getting exception in jquery file.

if possible to do it this way. What is the correct approach or can i achieven something similar to this?

Thanks

score 5 · Accepted Answer · edited May 23 '17 at 12:15

Your code:

var testRules = "{ col1: { required: true},col2: {maxlength: 50}}";

Just get rid of the quotation marks and it will work fine.

var testRules = { col1: { required: true},col2: {maxlength: 50}};

DEMO: http://jsfiddle.net/mNtcL/

For the purposes of my example, this is the base starting code:

HTML:

<input type="text" name="field_1" />
<input type="text" name="field_2" />
<input type="text" name="field_3" />

JS:

$('#myForm').validate({
    rules: {
        field_1: {
            required: true,
            number: true
        },
        field_2: {
            required: true,
            number: true
        },
        field_3: {
            required: true,
            number: true
        }
    }
});

DEMO: http://jsfiddle.net/rq5ra/

Yes, you can pull out the groups of rules and combine them into common variables.

var ruleSet1 = {
        required: true,
        number: true
    };

$('#myForm').validate({
    rules: {
        field_1: ruleSet1,
        field_2: ruleSet1,
        field_3: ruleSet1
    }
});

DEMO: http://jsfiddle.net/rq5ra/4/

You can also use .extend() to recombine them in an infinite numbers of ways.

var ruleSet_default = {
        required: true,
        number: true
    };

var ruleSet1 = {
        max: 99
    };
$.extend(ruleSet1, ruleSet_default); // combines defaults into set 1

var ruleSet2 = {
        min: 3
    };
$.extend(ruleSet2, ruleSet_default); // combines defaults into set 2


$('#myForm').validate({
    rules: {
        field_1: ruleSet2,
        field_2: ruleSet_default,
        field_3: ruleSet1
    }
});

End Result:

field_1 will be a required number no less than 3.
field_2 will just be a required number.
field_3 will be a required number no greater than 99.

DEMO: http://jsfiddle.net/rq5ra/5/

Also see this answer for more ways to apply rules.

Cant Ask for more @Sparky. Thanks for this excellent answer :) — Peru, Oct 23 '13 at 08:51
Quick question i have two rules var testRules1 = { col1: { required: true},col2: {maxlength: 10}}; var testRules2 = { col1: { required: true},col2: {maxlength: 50}}; and in rules how do i apply tat dynamically ? i need to apply based on conditions where i ll pass "1" or "2" and append to testRules rules : testRules+1 //Didnt work — Peru, Oct 23 '13 at 12:53
@Peru, the only way to dynamically change rules is with the `.rules()` method. See `.rules('add')` to over ride and `.rules('remove')` in the documentation. — Sparky, Oct 23 '13 at 13:30

score 1 · Answer 2 · answered Oct 22 '13 at 10:13

1

Well, only way i can think of is by using eval(), like:

var testRules = "{ col1: { required: true},col2: {maxlength: 50} }";
var obj=eval("("+testRules+")");
console.log( obj );

answered Oct 22 '13 at 10:13

Sudhir Bastakoti

99,167
15
158
162

1

No need for `eval()`. Removing the quotation marks makes it work. See: http://jsfiddle.net/mNtcL/ – Sparky Oct 22 '13 at 18:11
2

@Sparky +1 for that.., yes absolutely... :),i wonder why i couldnot get that simple thing.. :( – Sudhir Bastakoti Oct 23 '13 at 02:55
@Sudhir Quick question i have two rules var testRules1 = { col1: { required: true},col2: {maxlength: 10}}; var testRules2 = { col1: { required: true},col2: {maxlength: 50}}; and in rules how do i apply tat dynamically ? i need to apply based on conditions where i ll pass "1" or "2" and append to testRules rules : testRules+1 //Didnt work – Peru Oct 23 '13 at 12:54

JQuery validate - Assigning Rules as variable

2 Answers2