如何選擇GridView中的所有複選框？

Question

我想檢查放置在GridView中的ListView內的複選框。 Gridview有很多行，每一行都有一個List視圖和關聯的recrods。每行都包含一個名爲select all的CheckBox。我想檢查伴隨該特定行的子ListView控件的複選框。

我有一個服務器端代碼，我能夠做到這一點。但它花費的時間太長了......即如果有超過1000條記錄，幾乎需要1-2分鐘來選擇記錄。我希望這是使用Javascript完成的。我怎麼能做到這一點。

這是表示在GridView和ListView圖像。 GridView是組和聯繫人是ListView 當我在GridView中選擇「SelectAll」按鈕時，應該選擇適當的聯繫人。

我該如何使用Javascript來實現這一點。

這是網格視圖

<asp:GridView ID="GridViewGroups" runat="server" AutoGenerateColumns="False"          
           onrowdatabound="GridViewGroups_RowDataBound" Width="100%" 
           BorderColor="Silver" BorderStyle="Solid" BorderWidth="1px" 
           onselectedindexchanged="GridViewGroups_SelectedIndexChanged" 
           meta:resourcekey="GridViewGroupsResource1" > 
          <Columns> 
           <asp:TemplateField HeaderText="Groups" 
            meta:resourcekey="TemplateFieldResource1" HeaderStyle-CssClass="tSubHead"> 
            <ItemTemplate> 
             <div align="left" > 
            <asp:Panel ID="PanelContainer" runat="server" Width="100%" 
               meta:resourcekey="PanelContainerResource1" > 

            <asp:Panel ID="PanelHeaderList" runat="server" 
              meta:resourcekey="PanelHeaderListResource1" CssClass="tSubHead2" style="cursor:pointer;"> 
            <asp:ImageButton ID="Image1" runat="server" ImageUrl="../micons/IC_Plus.png" CssClass="tImage" 
              AlternateText="Expand or Collapse" meta:resourcekey="Image1Resource1"/> 
            <asp:Label ID="LabelGrpName_sm" runat="server" 
              Text='<%# string.Format("{0} ({1})", Eval("Grp_Name"),Eval("CountNo")) %>' 
              meta:resourcekey="LabelGrpName_smResource1" /> 
            </asp:Panel> 
            <div style="float:left;width:200px;" > 
            <asp:HiddenField ID="hfGrpID" runat="server" Value='<%# Eval("Grp_ID") %>' />  
             <asp:CheckBox ID="CheckBoxSelect" runat="server" AutoPostBack="True" class='<%#Eval("Grp_ID") %>' 
              OnCheckedChanged="GroupCheckChanged" 
              meta:resourcekey="CheckBoxSelectResource1" />    
            <b> <asp:Label ID="Grp_NameLabel" runat="server" 
              Text="Select All" 
              meta:resourcekey="Grp_NameLabelResource1" /> 
              </b> 

            </div> 

            <br /> 
            <p> 
            <asp:Panel ID="PanelGroupsItem" runat="server" Width="100%" 
              meta:resourcekey="PanelGroupsItemResource1" > 
            <asp:Panel ID="MyGroups" runat="server" ScrollBars="Vertical" Height="300px" 
              Width="100%" Visible='<%# GetFlag(Convert.ToInt32(Eval("Grp_ID"))) %>' 
              meta:resourcekey="MyGroupsResource1"> 

             <asp:ListView ID="ListViewContactsInGrp" runat="server" onitemdatabound="ListView1_ItemDataBound" > 
             <LayoutTemplate> 
              <table id="Table1" runat="server" style="width:100%;"> 
               <tr id="Tr1" runat="server"> 
                <td id="Td1" runat="server"> 
                 <table ID="itemPlaceholderContainer" runat="server" border="0" style="width:100%;"> 
                  <tr id="Tr2" runat="server" style=""> 
                   <th id="Th1" runat="server" colspan="2" class="tSubHead2"> 
                    Contacts</th>         
                  </tr> 
                  <tr ID="itemPlaceholder" runat="server"> 
                  </tr> 
                 </table> 
                </td> 
               </tr> 
               <tr id="Tr3" runat="server"> 
                <td id="Td2" runat="server" style=""> 
                </td> 
               </tr> 
              </table> 
             </LayoutTemplate> 
             <ItemTemplate> 
             <tr style=""> 
               <td class="tListViewAlignment" style="width:10px"> 
                <asp:CheckBox ID="chkFlag" runat="server" meta:resourcekey="chkFlagResource1" class='<%#Eval("grp_id") %>' /> 
               </td>     
               <td class="tListViewAlignment"><asp:Label ID="LabelContacts" runat="server" Text='<%# Eval("cont_name") %>' 
                 meta:resourcekey="LabelContactsResource1"></asp:Label> 
               <asp:HiddenField ID="hfGSM" runat="server" Value='<%# Eval("cont_gsm") %>' /> 
               </td> 
              </tr> 
             </ItemTemplate> 

             </asp:ListView> 


             </asp:Panel> 
            </asp:Panel> 
             </p> 
            <asp:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" 
               Collapsed="True" 
               TargetControlID="PanelGroupsItem" 
               CollapseControlID="PanelHeaderList" 
               ExpandControlID="PanelHeaderList" 
               ImageControlID="Image1" 
               ExpandedImage="~/micons/IC_minus.png" 
               CollapsedImage="~/micons/IC_Plus.png" 
               SuppressPostBack="True" Enabled="True"> 
            </asp:CollapsiblePanelExtender> 
            </asp:Panel> 
            </div> 


            </ItemTemplate> 
            <ItemStyle BorderColor="Silver" /> 
           </asp:TemplateField> 
          </Columns> 
          <HeaderStyle BorderColor="Silver" /> 
          <RowStyle BorderColor="Silver" /> 
         </asp:GridView> 

Answer 1

我認爲你需要像這樣的代碼：

function SelectCheckboxes(toCheck){ 
    $("#GridViewGroups input."+toCheck+":checkbox").each(function() { 
     this.attr("checked", "checked"); 
    }); 
} 

，你這樣稱呼它：

OnClick(SelectCheckboxes("class_to_check");) 

Answer 2

你可以用jQuery做這樣的事情。

$("#gridviewID input[type='checkbox']").each(function() { 
    $(this).prop('checked', true); 
}); 

或者，如果你所有的複選框具有相同的類

$(".checkboxClass").prop('checked', true); 

Answer 3

如果你給一個名稱，聯繫人列表爲每個複選框：

<input type="checkbox" name="contacts" id="contact_id" /> 

對於主複選框，其選擇所有複選框：

<input type="checkbox" name="select_all" id="contact_id" onclick="checkAll(this.id)" /> 

你可以使用下面的JavaScript函數：

利用這一點，當您選擇「全選」複選框，將選擇所有名爲「聯繫人」的chekboxes，它會刪除所選的複選框，如果「全選」未被選中。