Question

Hi there i am looping some fields with php.

$number = 5;
for ($i = 1; $i <= $number ; $i++) {
name : <input name="name[]" type="text" class="required"  title="Name Surname Please"/>
}

Am using jquery validation to control the fields,

$("#form").validate({
        errorLabelContainer: $("#form div.error")
    });

but it is only validating the first field of the loop. only after clicking on the other fields the plugin works.

Can someone help or explain that

the script:

<form action="" method="post" id="form" name="form">
  <table width="100%" border="0" cellspacing="5" cellpadding="0">
    <?php  for ($i = 1; $i <= 5; $i++) {?>
    <tr>
      <td>name :
        <input name="name[]" type="text" class="required"  title="Name Surname Please"/></td>
    </tr>
    <?php }?>
  </table>
  <input name="submit-form" type="submit" value="submit"/>
</form>
<script src="/jquery.validate.js" type="text/javascript" charset="utf-8"></script> 
<script type="text/javascript">

$().ready(function() {
    $("#form").validate({
        errorLabelContainer: $("#form div.error")
    });


});
</script>

Answer 1

I think the issue has to do with your name attribute. Jquery validate finds which field to put the error under by searching the DOM for the name attribute and matches the error to the name. Since all of your inputs have the same name name[] it might be just finding the first one and putting the error there.

Try making your names unique like this:

<form action="" method="post" id="form" name="form">
  <table width="100%" border="0" cellspacing="5" cellpadding="0">
    <?php  for ($i = 1; $i <= 5; $i++) {?>
    <tr>
      <td>name :
        <input name="name[<?php echo $i; ?>]" type="text" class="required"  title="Name Surname Please"/></td>
    </tr>
    <?php }?>
  </table>
  <input name="submit-form" type="submit" value="submit"/>
</form>
<script src="/jquery.validate.js" type="text/javascript" charset="utf-8"></script> 
<script type="text/javascript">

$().ready(function() {
    $("#form").validate({
        errorLabelContainer: $("#form div.error")
    });


});
</script>

I don’t know PHP so the syntax of how to inject the index into the name attribute value may be incorrect.