title: jquery select checkboxes in nested gridview when parent checkbox checked
body: <p>I would like to check the checkboxes of all of the rows in a nested gridview is the checkbox of the parent is checked. Or uncheck all of the checkboxes in the nested gridview when the parent is unchecked.  </p>
  
  <p>I found a jquery example that almost fits my needs.  However, when you select a checkbox in the parent grid, it checks all of the checkboxes in the parent grid and all children grids.  I would like it to check all of the boxes in only the child grid.</p>
  
  <p>The problem, I believe, is identifying the correct grid to update the checkboxes.
  The line, <strong>var grid = $(this).closest("table");</strong>, traverses up the tree and selects all of the districts.
  I need to idenitify the InternalGrid of this district.  But I have tried using .children() and several of things but it is not working.</p>
  
  <p>So how to I identify the InternalGrid of the district that has been selected?</p>
  
  <p>The jquery is as follows:</p>
  
  <pre><code> $("[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");
              }
          });       
      });
  </code></pre>
  
  <p>Thanks</p>
  
  <p>Here is the HTML:
   
       
           </p>
  
  <pre><code>    &lt;Columns&gt;
          &lt;asp:TemplateField HeaderText="District" SortExpression="district" HeaderStyle-Width="200px"&gt;
              &lt;ItemTemplate&gt;
              &lt;a href="javascript:divexpandcollapse('div&lt;%# Eval("district")%&gt;');"&gt;
              &lt;img id="imgdiv&lt;%# Eval("district")%&gt;" width="10px" border="0" src="Images/plus.png" /&gt; &lt;/a&gt; 
              &lt;asp:CheckBox ID="District" Text='&lt;%#Bind("district")%&gt;' runat="server"  /&gt;
              &lt;/ItemTemplate&gt;
              &lt;HeaderStyle Width="200px"&gt;&lt;/HeaderStyle&gt;
              &lt;ItemStyle HorizontalAlign="Center" Width="200px"&gt;&lt;/ItemStyle&gt;
          &lt;/asp:TemplateField&gt; 
  
          &lt;asp:TemplateField HeaderText="Server" HeaderStyle-Width="280px"&gt;
          &lt;ItemTemplate&gt;
          &lt;asp:DropDownList DataTextField="Server" DataValueField="Server" ID="DropDownList2" Runat="server" &gt;
             &lt;asp:ListItem&gt;A1&lt;/asp:ListItem&gt;
             &lt;asp:ListItem&gt;A2&lt;/asp:ListItem&gt;
             &lt;asp:ListItem&gt;Both&lt;/asp:ListItem&gt;
          &lt;/asp:DropDownList&gt;
  
                  &lt;tr&gt;&lt;td colspan="100%"&gt;  
                  &lt;div id="div&lt;%# Eval("district") %&gt;" style="display:none; position: relative; left: 15px; overflow: auto"&gt;
  
                        &lt;asp:GridView ID="InternalGrid" runat="server" AutoGenerateColumns="False"  OnSorting="GridView1_Sorting" 
                             BorderStyle="Ridge" BorderWidth="2px"  HorizontalAlign="Center"
                             GridLines="Both" ShowHeader="True" ShowFooter="False" &gt;
                          &lt;HeaderStyle BackColor="#4A3C8C" ForeColor="#E7E7FF"&gt;&lt;/HeaderStyle&gt;
                          &lt;Columns&gt;
                              &lt;asp:TemplateField HeaderText="Station"  SortExpression="number"&gt;
                                  &lt;ItemTemplate&gt;
                                  &lt;asp:CheckBox ID="Station" Text='&lt;%#Bind("number")%&gt;' runat="server" onclick="Check_Click(this)"/&gt;
                                  &lt;/ItemTemplate&gt;
                                  &lt;ItemStyle HorizontalAlign="Center" Width="130px"&gt;&lt;/ItemStyle&gt;
                               &lt;/asp:TemplateField&gt;
  
                               &lt;asp:TemplateField HeaderText="Server" &gt;
                                  &lt;ItemTemplate&gt;
                                  &lt;asp:DropDownList DataTextField="Server" DataValueField="Server" ID="DropDownList2" Runat="server" &gt;
                                     &lt;asp:ListItem&gt;A1&lt;/asp:ListItem&gt;
                                     &lt;asp:ListItem&gt;A2&lt;/asp:ListItem&gt;
                                     &lt;asp:ListItem&gt;Both&lt;/asp:ListItem&gt;
                                  &lt;/asp:DropDownList&gt;
                                  &lt;/ItemTemplate&gt;
                                   &lt;ItemStyle HorizontalAlign="Center" Width="130px"&gt;&lt;/ItemStyle&gt;
                              &lt;/asp:TemplateField&gt;
  
                              &lt;asp:BoundField DataField="TimeZone" HeaderText="Time Zone" SortExpression="timeZone"&gt;
                                  &lt;ItemStyle HorizontalAlign="Center" Width="130px" /&gt;
                              &lt;/asp:BoundField&gt;
  
                               &lt;asp:BoundField DataField="ServerType" HeaderText="Server Type" SortExpression="serverType"&gt;
                                  &lt;ItemStyle HorizontalAlign="Center" Width="135px" /&gt;
                              &lt;/asp:BoundField&gt;
  
                         &lt;/Columns&gt;
                          &lt;RowStyle BackColor="#DEDFDE" ForeColor="Black" /&gt;
                      &lt;/asp:GridView&gt;
  
                      &lt;/div&gt; 
                   &lt;/td&gt;&lt;/tr&gt; 
              &lt;/ItemTemplate&gt;
              &lt;HeaderStyle Width="305px"&gt;&lt;/HeaderStyle&gt;
               &lt;ItemStyle HorizontalAlign="Center" Width="280px"/&gt;
           &lt;/asp:TemplateField&gt;                                    
      &lt;/Columns&gt;
  &lt;BoundaryStyle BorderColor="Gray" BorderWidth="1px" BorderStyle="Solid"&gt;&lt;/BoundaryStyle&gt;
  &lt;RowStyle BackColor="#DEDFDE" ForeColor="Black" /&gt;
  &lt;/cc1:CoolGridView&gt;
  &lt;/div&gt;
  </code></pre>