在asp.net转发器中选中复选框时,使用javascript显示标签

时间:2011-09-27 15:45:18

标签: javascript asp.net checkbox repeater

我有一个asp.net转发器,其中有4列由数据集填充,该数据集是从sql server中提取的。其中一个字段是复选框,所有其他字段都是标签。一个字段称为“类型”。每条记录将是两种类型之一。我想要做的是使用javascript检查是否选中了复选框,如果是,则显示文本框中“类型”的计数。例如,将有两个文本框,一个将显示“类型1有3个已检查”,另一个将显示“类型2已检查3”。我目前有一个Javascript函数(见下文),它会计算所有选中的复选框并在文本框中显示计数,但我希望能够跟踪每种类型的计数。在javascript中是否有任何方法我可以在检查复选框是否被选中时捕获该类型。

的JavaScript

function checkrpt() {
    var inputs = document.getElementsByTagName('input');
    var count = 0

    for (var i = 0; i < inputs.length; i++) {

        if (inputs[i].type == "checkbox") {
            if (inputs[i].checked == true)

                    count += 1;
            }
            if (count > 6) {
                inputs[i].checked = false;
            }
        }

    if (count > 0) {
        document.getElementById('txtSelectionStatus').value = count + ' items have been selected';
    } else {
        document.getElementById('txtSelectionStatus').value = 'No items have been selected';
    }
    if (count > 6) {
        document.getElementById('txtSelectionStatus').value = 'You can only select 6 itmes';
    }
}

ASP:中继器

 <asp:repeater id="rptStep1Data" runat="server">
   <HeaderTemplate>
     <table width="100%" border="1" cellpadding="0" cellspacing="0">
       <tr style="backgound-color:#DDDDDD;">
         <td width="150px" align="center" class="tableheader"><b>Add To Grid</b></td>
         <td width="100px" class="tableheader" align="center"><b>Distance</b></td>
         <td width="400px" align="left" class="tableheader"><b>Address</b></td>
         <td width="100px" align="center" class="tableheader"><b>Type</b></td>
       </tr>
       <tr>
         <td colspan="4">
           <div style="overflow:scroll; overflow-x:hidden; height: 300px; width: 100%">
             <table width="100%" border="1" cellpadding="0" cellspacing="0">
   </HeaderTemplate>
   <ITEMTEMPLATE>
               <tr>
                 <td  width="148px" align="center" class="content">
                   <asp:checkbox id="chkSelected" runat="server" onClick="javascript:checkrpt()" Checked='<%# makeChecked(Container.DataItem("Selected")) %>' />
                 </td>
                 <td width="100px" align="center" class="content">
                   <asp:label id="lblDistance" runat="server" Text='<%# Container.DataItem("Distance") %>' />                                                    
                 </td>
                 <td width="390px" align="left" style="padding-left:10px" class="content">                                                    
                   <asp:label id="lblAddress" runat="server" Text='<%# Container.DataItem("Address") %>' />                                                    
                 </td>
                 <td width="100px" align="center" class="content">                                                    
                   <asp:label id="lblType" runat="server" Text='<%# Container.DataItem("Type") %>' />                                                    
                 </td>
               </tr>
   </ITEMTEMPLATE>
   <ALTERNATINGITEMTEMPLATE>
               <tr>
                 <td align="center" class="content">
                   <asp:checkbox id="chkSelected" runat="server" onClick="javascript:checkrpt()" Checked='<%# makeChecked(Container.DataItem("Selected")) %>' />
                 </td>
                 <td align="center" class="content">                                                    
                   <asp:label id="lblDistance" runat="server" Text='<%# Container.DataItem("Distance") %>' />                                                    
                 </td>
                 <td align="left" style="padding-left:10px" class="content">                                                    
                   <asp:label id="lblAddress" runat="server" Text='<%# Container.DataItem("Address") %>' />                                                    
                 </td>
                 <td align="center" class="content">                                                    
                   <asp:label id="lblGLA" runat="server" Text='<%# Container.DataItem("Type") %>' />                                                    
                 </td>
               </tr>
   </ALTERNATINGITEMTEMPLATE>
   <FooterTemplate>
             </table>
           </div>
         </td>
       </tr>
     </table>
   </FooterTemplate>
 </asp:repeater>

1 个答案:

答案 0 :(得分:0)

尝试使用onClientClick= "checkrpt()"代替onClick事件checkboxonClientClick运行客户端javascript代码。