开发者

JQuery Validation for Array of Input Elements

I need to validate an array of input text el开发者_C百科ements (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.


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 ;)

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜