2012-06-08 25 views
0

当点击保存按钮时,需要验证生成的html表格(网格)中的文本框值。以下是我到目前为止。我使用Firebug来追踪代码,它只循环第一行,但我需要循环从标记中第二行开始的行。请任何帮助。如何使用jquery验证表格(网格)中的文本框值

HTML代码

<div class="msg-body"> 
    <table class="dynamictable"> 
       <thead> 
        <tr> 
         <th style="display: none"></th> 
         <th>Package Name</th> 
         <th>Package Cost</th> 
         <th>No. of Attendees</th> 
         <th>Delete</th> 
        </tr> 
       </thead> 
       <tbody> 
       <tr class="prototype"> 
         <td style="display: none"><input type="hidden" name="id[]" value="" class="id" /></td> 
         <td><input type="text" name="packagename[]" value="" class="pkname" /></td> 
         <td><input type="text" name="packagecost[]" value="" class="pkcost"/></td> 
         <td><input type="text" name="noofattendees[]" value="" class="nfattendees"/></td> 
         <td>@Html.ActionImage("", null, "~/Content/Images/delete.gif", "Delete", new { @class = "deleterows" }) </td> 
       </tr> 
       <tr> 
        <td style="display: none"><input type="hidden" name="id[]" value="" class="id" /></td> 
        <td><input type="text" name="packagename[]" value="" class="pkname" /></td> 
        <td><input type="text" name="packagecost[]" value="" class="pkcost"/></td> 
        <td><input type="text" name="noofattendees[]" value="" class="nfattendees"/></td> 
        <td>@Html.ActionImage("", null, "~/Content/Images/delete.gif", "Delete", new { @class = "deleterows" }) </td> 
       </tr> 
      </tbody> 
    </table> 
    <div style="padding:20px 0 20px 100px "><input type="button" id="btnAddButton" value="Add New" class="button addbutton"/><input type="button" id="btnSaveRow" value="Save" class="button addbutton"/></div> 
</div> 

JavaScript代码

$("#btnSaveRow").click(function() { 
     $('.dynamictable tr').each(function() { 
      var $val = $("input[type='input']").val(); 
      if ($val == "") { 
       alert("Please enter data"); 
       $(this).focus(); 
       return false; 
      } 
       return true; 
     }); 

回答

2
$("#btnSaveRow").click(function() { 
    $("input[type='text']", ".dynamictable tbody tr:gt(0)").each(function() { 
     if (!$.trim(this.value)) { 
      alert("Please enter data"); 
      $(this).focus(); 
      return false; 
     } 
     return true; 
    }); 
}); 

DEMO

+0

谢谢你的答案,但我需要它开始从第二行循环不在第一行。第一行不应该被验证,因为它是隐藏的,它仅用于克隆行。如何做到这一点? – user335160

+0

@ user335160我编辑了我的答案,请检查 – thecodeparadox

+0

非常感谢你,它的工作原理... – user335160