Geek Answers Handbook

Validating multiple text fields with the same name using jquery validator validates only first input

I am trying to check two inputs with the same name using jquery validator ..

<script src=' http://code.jquery.com/jquery-latest.min.js '></script> <script src='http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js'></script> <script> $(document).ready(function(){ $('#frm').validate(); $("[name=inp_text]").each(function(){ $(this).rules("add", { required: true, checkValue: true }); }); $.validator.addMethod("checkValue", function(value, element) { var response = ((value > 0)&&(value <= 100))||((value == 'test1')||(value =='test2')); return response; }, "invalid value"); }) </script> <form id='frm' method='post'> <input type='text' name='inp_text'/><br> <input type='text' name='inp_text'/><br> <input type='submit' name=''/> </frm>

but when I run this code, it only checks the first inputs, and the second input is just ignored

I also tried using <input type='text' name='inp_text[]'/><br> , but still didn't work.

what should i change ...?

Thank you in advance

+4
source share
4 answers

"I'm trying to check two inputs with the same name with jquery validator ..."

 <input type='text' name='inp_text'/> <input type='text' name='inp_text'/>

"but when I run this code, it only checks the first inputs and the second inputs are just ignored"

You cannot have two input type="text" fields with the same name , or this plugin will not work properly. The name attribute must be unique. (The only exception to name , which is unique, is that the “groups” of flags or radio inputs will have the same name , since the corresponding representation is a single data point. However, the name must be unique for each group of flags and radio elements.)

"what should I change ...?"

Make each name attribute unique.

 <input type='text' name='inp_text[1]'/> <input type='text' name='inp_text[2]'/>

Then use the "starts with" selector, ^= ...

 $("[name^=inp_text]").each(function () { $(this).rules("add", { required: true, checkValue: true }); });

Working DEMO: http://jsfiddle.net/PgLh3/

NOTES . You can also customize id elements using the rules('add') method, but nothing has been decided for this case, because the plugin still requires a unique name for each input .

+12
source

Add a configuration similar to the following rules or messages

 multipleInputSharedName: { inp_text: true }

Change the code in jquery.validate.js Method name: elements

replace the following

 if ( this.name in rulesCache || !validator.objectLength( $( this ).rules() ) ) { return false; }

with the following

 if ( (!validator.settings.multipleInputSharedName[this.name] && this.name in rulesCache) || !validator.objectLength( $( this ).rules() ) ) { return false; }
0
source

Yes, JQuery validation only validates the first occurrence. You use different names for text fields. OR You can use the same names, but also different identifiers. and apply the check according to the identifier.

$ ("# myform"). validate ({rules: {#id_of_field: {required: true, checkValue: true}}});

-1
source

Friends!

To check the text box / checkbox / select with the same name use the following, this works fine for me.

Here 'ctryId' is the name of the selection field.

 function validateCountry(){ inp = document.getElementsByTagName("select"); for ( var i = 0; i < inp.length; ++i ) { if (inp[i].name =="ctryId" && inp[i].value==''){ alert('plesae select a country!'); return false; } } return true; }

Here "minVal" is the name of the text field

 function validateMinimumVal(){ inp = document.getElementsByTagName("TEXT"); for ( var i = 0; i < inp.length; ++i ) { if (inp[i].name =="minVal" && inp[i].value==''){ alert('plesae Add a MINIMUM VALUE!!'); return false; } } return true; }

Hope this helps! Jagana

-1
source

More articles:


All Articles