Jquery validator vs. bidimensional arrays

Question

I'll just start with the example of my problem:

<form>
    <input name="course[0][name]" />
    <input name="course[0][type]" />

    <input name="course[1][name]" />
    <input name="course[1][type]" />

    ...
    ...
</form>

obs: this is, of course, simplified.

So...how can i validate those since i can't predict the name? Is there a way to use regular expressions or something? utopic example:

rules: {
    /course\[([0-9]+)\]\[name\]/: {
        required: true
    }
}

I couldn't find the solution in the documentation since its a bit confusing. thank you (:

Yes, i can. But what about the methods with parameters other than true or false? — Hugo Mota, Aug 12 '11 at 01:23

score 1 · Answer 1 · edited May 23 '17 at 10:34

1

So, I did a little bit of searching, and it looks like the keys in the rules object are simple jQuery selectors. According to this question, there is a regex filter which can be used. Between the two, your regex above should work.

Original idea:

... you don't need to predict them, your server already knows them. Just output that number into a script tag and then loop. Heck, you can even have the server loop for you.

If that is not an option, then you can use jQuery:

var rules = {
 // simple rule, converted to {required:true}
 name: "required",
 // compound rule
 email: {
   required: true,
   email: true
 }
 // whatever
}
// obviously, for just required, there are easier ways
var checkRules = {required:true}; 
$('#form-id input').each(function(i, elem)
{
   /check\[\d\]\[(name|type)\]/.test(elem.name)
   rules[elem.name] = checkRules
});

edited May 23 '17 at 10:34

Community

1
1

answered Aug 12 '11 at 01:26

cwallenpoole

79,954
26
128
166

well...this should actually work, thank you. But i was really hoping for "cleaner" solutions =/ – Hugo Mota Aug 12 '11 at 01:35
great! so how should i write the rules selector? i'm trying this first: `$(:regex(...)):{ required: true; }` – Hugo Mota Aug 12 '11 at 02:04
I thought it was more like this: `var rules = { /* do something */ }; rules[':regex(name,/check\[\d\]\[(name|type)\]/)']` – cwallenpoole Aug 12 '11 at 02:16

score 1 · Accepted Answer · answered Aug 12 '11 at 02:02

As an alternative you can do something like this

$.validator.addClassRules({
    inputName: {
        required: true,
        minLength: 5
    },
    inputType: {
        required: true,
        remote: "remoteurl"
    }
});
<input name="course[0][name]" class="inputName"/>
<input name="course[0][type]" class="inputType"/>

miku · Answer 3 · 2011-08-12T01:36:54.947

More a workaround: By default, you can specify a class named required on the fields that are required.

Another option would be to fill up the rules options programmatically (complete code in this gist):

Assuming a simple example HTML with the following body:

<body>
    <form id="example">
    <input  name="course[0][name]" />
    <input  name="course[0][type]" />

    <input  name="course[1][name]" />
    <input  name="course[1][type]" />

    <input type="submit" name="some_name" value="Go" id="some_name">
    </form>
</body>

The corresponding javascript to determine matching elements via filter:

    $(document).ready(function(){

        var options = { rules : {} }

        // put your regex in here ...
        var courses = $('input').filter(function(){
            return this.name.match(/course\[([0-9]+)\]\[name\]/);
        });

        for (var i = courses.length - 1; i >= 0; i--){
            options["rules"][courses[i].name] = { required : true };
        };

        $("#example").validate(options);
    });

@hugo_leonardo, updated my post with another method (incl. sample code). — miku, Aug 12 '11 at 01:48

Jquery validator vs. bidimensional arrays

3 Answers3

Original idea: