Question

我想检查嵌套gridview中所有行的复选框是否选中了父级的复选框。或者取消选中父级时取消选中嵌套gridview中的所有复选框。

我发现了一个几乎符合我需求的jquery示例。但是，当您在父网格中选中一个复选框时，它会检查父网格和所有子网格中的所有复选框。我希望它只检查子网格中的所有框。

我认为，问题在于确定更新复选框的正确网格。行 var grid = $（this）.closest（“table”）; ，遍历树并选择所有区域。我需要识别这个区的InternalGrid。但是我尝试过使用.children（）和其他一些东西，但它没有用。

那么如何识别已选择的区域的InternalGrid？

jquery如下：

 $("[id*=District]").live("click", function () 
 {
        var chkHeader = $(this);

        var grid = $(this).closest("table");

        $("input[type=checkbox]", grid).each(function ()   
        {
            if (chkHeader.is(":checked"))   
            {
                $(this).attr("checked", "checked");
                $("td", $(this).closest("tr")).addClass("selected");
            } 
            else 
            {
                $(this).removeAttr("checked");
                $("td", $(this).closest("tr")).removeClass("selected");
            }
        });       
    });

由于

这是HTML：

    <Columns>
        <asp:TemplateField HeaderText="District" SortExpression="district" HeaderStyle-Width="200px">
            <ItemTemplate>
            <a href="javascript:divexpandcollapse('div<%# Eval("district")%>');">
            <img id="imgdiv<%# Eval("district")%>" width="10px" border="0" src="Images/plus.png" /> </a> 
            <asp:CheckBox ID="District" Text='<%#Bind("district")%>' runat="server"  />
            </ItemTemplate>
            <HeaderStyle Width="200px"></HeaderStyle>
            <ItemStyle HorizontalAlign="Center" Width="200px"></ItemStyle>
        </asp:TemplateField> 

        <asp:TemplateField HeaderText="Server" HeaderStyle-Width="280px">
        <ItemTemplate>
        <asp:DropDownList DataTextField="Server" DataValueField="Server" ID="DropDownList2" Runat="server" >
           <asp:ListItem>A1</asp:ListItem>
           <asp:ListItem>A2</asp:ListItem>
           <asp:ListItem>Both</asp:ListItem>
        </asp:DropDownList>

                <tr><td colspan="100%">  
                <div id="div<%# Eval("district") %>" style="display:none; position: relative; left: 15px; overflow: auto">

                      <asp:GridView ID="InternalGrid" runat="server" AutoGenerateColumns="False"  OnSorting="GridView1_Sorting" 
                           BorderStyle="Ridge" BorderWidth="2px"  HorizontalAlign="Center"
                           GridLines="Both" ShowHeader="True" ShowFooter="False" >
                        <HeaderStyle BackColor="#4A3C8C" ForeColor="#E7E7FF"></HeaderStyle>
                        <Columns>
                            <asp:TemplateField HeaderText="Station"  SortExpression="number">
                                <ItemTemplate>
                                <asp:CheckBox ID="Station" Text='<%#Bind("number")%>' runat="server" onclick="Check_Click(this)"/>
                                </ItemTemplate>
                                <ItemStyle HorizontalAlign="Center" Width="130px"></ItemStyle>
                             </asp:TemplateField>

                             <asp:TemplateField HeaderText="Server" >
                                <ItemTemplate>
                                <asp:DropDownList DataTextField="Server" DataValueField="Server" ID="DropDownList2" Runat="server" >
                                   <asp:ListItem>A1</asp:ListItem>
                                   <asp:ListItem>A2</asp:ListItem>
                                   <asp:ListItem>Both</asp:ListItem>
                                </asp:DropDownList>
                                </ItemTemplate>
                                 <ItemStyle HorizontalAlign="Center" Width="130px"></ItemStyle>
                            </asp:TemplateField>

                            <asp:BoundField DataField="TimeZone" HeaderText="Time Zone" SortExpression="timeZone">
                                <ItemStyle HorizontalAlign="Center" Width="130px" />
                            </asp:BoundField>

                             <asp:BoundField DataField="ServerType" HeaderText="Server Type" SortExpression="serverType">
                                <ItemStyle HorizontalAlign="Center" Width="135px" />
                            </asp:BoundField>

                       </Columns>
                        <RowStyle BackColor="#DEDFDE" ForeColor="Black" />
                    </asp:GridView>

                    </div> 
                 </td></tr> 
            </ItemTemplate>
            <HeaderStyle Width="305px"></HeaderStyle>
             <ItemStyle HorizontalAlign="Center" Width="280px"/>
         </asp:TemplateField>                                    
    </Columns>
<BoundaryStyle BorderColor="Gray" BorderWidth="1px" BorderStyle="Solid"></BoundaryStyle>
<RowStyle BackColor="#DEDFDE" ForeColor="Black" />
</cc1:CoolGridView>
</div>

Answer 1

我想出来了！如果有人在那里挣扎着这样的事情。这对我有用......

只需要使用子网格的ID设置网格变量。所以替换这一行： var grid = $（this）.closest（“table”）;

使用以下行： var $ checkboxLabel =“[id * = div”+ $（this）.next（'label'）。text（）+“]”; var nestedGrid = $（$ checkboxLabel）;

就是这样。

当选中父复选框时，jquery在嵌套gridview中选中复选框

1 个答案: