2015-01-12 57 views
1

http://www.kosherjellyfish.com/test/index.php如何创建动态生成的场

规则我使用[jQuery验证插件] [1]我的形式。

我在动态生成的表格中有表单字段:表的数量取决于用户创建的数量。下表中的示例:

<?php (for $i=1;$i<3;$i++){?> 
<table class="coauthortable"> 

    <tr> 
     <td>Title * </td> 
     <td> 
      <select name="contactTitle<? echo $i;?> "> 
      <option value="">Select Title</option> 
      <option value="Dr">Dr</option> 
      <option value="Miss">Miss</option> 
      <option value="Mr">Mr</option> 
      <option value="Mrs">Mrs</option> 
      <option value="Ms">Ms</option> 
      <option value="Professor">Professor</option> 
     </select> 
     </td> 
    </tr> 

    <tr> 
     <td>First Name *</td> 
     <td><input type="text" name="contactFirstName<? echo $i;?>" style="width:280px;" /></td> 
    </tr> 


    <!--Actual program has more rows--> 

</table> 
<?php } ?>      

我想验证规则添加到动态生成的输入字段:好像我不能在验证方法本身做正确的,因为我不知道实际要生成这回事字段数:

$("#papersubmitform").validate(
     { 
     rules:{ 
      //Can't add rules this way as I do not know how many rows will be generated. 
      contactTitle: {required: true}, 
      contactFirstName: { required:true}, 

}); 

我试图添加会在$添加规则,但它似乎(文件)。就绪(函数()一次加载页面时,不去工作

$(document).ready(function() { 
    $(".coauthortable").each(function(i){ 
      $(this).find(":input").each(function(){ 
       $(this).rules("add",{required:true}); 
      });   
}); 

    $("#papersubmitform").validate();   


}); 

有没有人对我应该如何将规则添加到动态创建的元素有任何建议?

我在自己的服务器中创建的样本页面在这里... http://www.kosherjellyfish.com/test/index.php

回答

1

你只需要做的是,在相反的顺序:

$(document).ready(function() { 
    $("#papersubmitform").validate();   

    $(".coauthortable").each(function(i){ 
      $(this).find(":input").each(function(){ 
       $(this).rules("add",{required:true}); 
      });   
    }); 
}); 
+0

大,现在的工作:) – kosherjellyfish