I need to validate an array of input text elements (mileage): For example:

<tbody>
  <c:forEach items="${list}" var="item">
        <tr> 
             <!--some other columns---> 
             <td align="left"><input type="text" name="mileage" value="" /></td>
        </tr>
   </c:forEach>                       
</tbody>

The script for validation is as below -

$(document).ready(function(){

        $("#form1").validate({
            rules: {
                mileage: {
                    required: true

                         }
                },            
            submitHandler: function(form) {
                form.submit();
            }

        });       
    });

Now the problem is that the .validate.js only validates the first element of mileage. What can I do? How can I make the plugin validate all of the inputs text ?

I hope you can help me out.

I need to validate an array of input text elements (mileage): For example:

<tbody>
  <c:forEach items="${list}" var="item">
        <tr> 
             <!--some other columns---> 
             <td align="left"><input type="text" name="mileage" value="" /></td>
        </tr>
   </c:forEach>                       
</tbody>

The script for validation is as below -

$(document).ready(function(){

        $("#form1").validate({
            rules: {
                mileage: {
                    required: true

                         }
                },            
            submitHandler: function(form) {
                form.submit();
            }

        });       
    });

Now the problem is that the .validate.js only validates the first element of mileage. What can I do? How can I make the plugin validate all of the inputs text ?

I hope you can help me out.

• javascript
• jquery
• html
• jquery-validate

4 Answers 4

In jquery.validate.js, we can find a function named checkForm, we have to modify it as below:

checkForm: function() {
                this.prepareForm();
                for ( var i = 0, elements = (this.currentElements = this.elements()); elements[i]; i++ ) {
                    if (this.findByName( elements[i].name ).length != undefined && this.findByName( elements[i].name ).length > 1) {
                        for (var cnt = 0; cnt < this.findByName( elements[i].name ).length; cnt++) {
                            this.check( this.findByName( elements[i].name )[cnt] );
                        }
                        } else {
                    this.check( elements[i] );
                }
                }
            return this.valid();
    }

Based on eddy answer, this function takes into count also the ignore setting.

        checkForm: function() {
            this.prepareForm();
            for ( var i = 0, elements = (this.currentElements = this.elements()); elements[i]; i++ ) {
                var checkingElements = this.findByName( elements[i].name ).not(this.settings.ignore);
                if (checkingElements.length !== undefined && checkingElements.length > 1) {
                    for (var cnt = 0; cnt < checkingElements.length; cnt++) {
                        this.check( checkingElements[cnt] );
                    }
                } else {
                    this.check( elements[i] );
                }
            }
            return this.valid();
        },

You have to loop through in these cases, like this:

$(document).ready(function() {
    $("#form1").validate({
        submitHandler: function(form) {
            form.submit();
        }
    });  
    $("#form1 input[name='mileage']").each(function() {
       $(this).rules("add", { required: true });
    });  
});

.rules() only affects the first match, so you need a .each() on there to loop through and add any rules to all matches.

Using jquery validate 1.19.1 and modifying the jquery.validate.js file on line 465, replacing with this function should be fine.

checkForm: function() {
            this.prepareForm();
            for ( var i = 0, elements = (this.currentElements = this.elements()); elements[i]; i++ ) {
                var checkingElements = this.findByName( elements[i].name ).not(this.settings.ignore);
                if (checkingElements.length !== undefined && checkingElements.length > 1) {
                    for (var cnt = 0; cnt < checkingElements.length; cnt++) {
                        this.check( checkingElements[cnt] );
                    }
                } else {
                    this.check( elements[i] );
                }
            }
            return this.valid();
        },

I hope to be of help ;)