1

How will I validate the input boxes which are generated in a PHP for loop using jQuery? In my code I am using jquery.min.js library and jquery.validate.min.js and simply calling the validate function.

I am getting error messages for only first row but not for the other rows. any suggesion much appreciated ... thanxx in advance.

<html>
<head>
<TITLE></TITLE>
<script type="text/javascript" src="first/js/jquery.min.js"></script>
<script type="text/javascript" src="first/js/jquery.validate.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

         $("#frm").validate({
                    rules:{
                        'name[]':{
                            required:true
                        },
                        'mail[]':{
                            required:true,
                            email:true
                         }
                    },
                    messages:{
            'name[]':{
                required:"Enter name"
            },
             'mail[]':{
                            required:" Enter mail",
                            email:"Enter valid mail"
                        }
                    },

                    submitHandler:function(){
                        form.submit();
                    }
                });
            });
</script>
</head>

<body>
<form name="frm" id="frm" action="exa.php">
<table>
<tr><TH>Name:</TH><TH>Email:</TH></tr>
<?php
for ($i=1;$i<=3;$i++)
{
?>
<tr><TD><input name="name[]" type="text" id="name[]" class="required" minlength="2"/></TD>
<TD><input name="mail[]" type="text" id="mail[]" class="required email" /></TD></tr>
<?php
}
?>

<tr><TD colspan="2" align="center"><input type="submit" name="submit" value="Submit"></TD></tr>

</table>
</form>
</body>
</html>
Sekhu
  • 139
  • 1
  • 12
  • 5
    You should title your question in a more on-topic way. The current title won't let people find your question or get an idea of its topic. – Denys Séguret May 24 '13 at 12:34
  • thanxx for your suggesion ... can you please help me out ... – Sekhu May 24 '13 at 12:40
  • I am not sure it is possible... the problem is that you have the same name for your elements...the plugin seems to not like this – mlwacosmos May 24 '13 at 14:28
  • got answers from the links below .. just few changes in the jquery.validate.js and finally it works.. – Sekhu May 25 '13 at 06:05

2 Answers2

1

Most of the modern browsers now are HTML5 compatible and if you think your website will be accessed from HTML5 compatible browsers, I suggest that you use the required attribute for <input> and email type.

Eg:

<input type='text' name='name[]' required />
<input type='email' name='email[]' required />    

These will only work if you write <!DOCTYPE HTML> before <html>.

I guess this would be the cleanest way to validate your input fields

draxxxeus
  • 1,503
  • 1
  • 11
  • 14
  • IMO, this shouldn't be suggested as using `required` attribute for form validation isn't a good approach at this time, in 2 years' time maybe yes – asprin May 24 '13 at 13:53
  • Ya, i agree. That's why i have added a disclaimer in the first line.. For some applications where we know that the browsers will be update-to-date, i think it is a smart choice – draxxxeus May 24 '13 at 13:54
  • thanx friends .. got the esier answers from the above links . just few changes in the code in jquery.validate.js and it works ... – Sekhu May 25 '13 at 06:03
1

Indeed, it looks like it is not naturally possible.

But you can change the source of jquery.validate.js. There is another stackoverflow post :

https://stackoverflow.com/a/4136430/432513

and especially : http://www.codeboss.in/web-funda/2009/05/27/jquery-validation-for-array-of-input-elements/

Community
  • 1
  • 1
mlwacosmos
  • 4,391
  • 16
  • 66
  • 114