Checkbox select all doesnt work

Question

Hi, I've tried select all but it doesn't check all the box

 

html code:

<asp:GridView ID="GridParents" runat="server" AutoGenerateColumns="False" AutoGenerateEditButton="true" AllowPaging="true" AllowSorting="true" DataKeyNames="Parent_ID" DataSourceID="SQLParents" PageSize="3">
   <Columns>
      <asp:TemplateField>
         <HeaderTemplate>
            <asp:CheckBox ID="checkAll" onClick="javascript:SelectAll(this);" runat="server"></asp:CheckBox>
         </HeaderTemplate>
         <ItemTemplate>
            <asp:CheckBox ID="checkThis" runat="server"></asp:CheckBox>
         </ItemTemplate>
      </asp:TemplateField>

      <asp:BoundField DataField="Parent_ID" HeaderText="Parent ID" InsertVisible="false" ReadOnly="true" SortExpression="Parent_ID" />
      <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
      <asp:BoundField DataField="Age" HeaderText="Age" SortExpression="Age" />
      <asp:BoundField DataField="Gender" HeaderText="Gender" SortExpression="Gender" />
   </Columns>
</asp:GridView>

 

 

Script code: 

<script type="text/javascript">
   function SelectAll(mainCheck) {
   var IsChecked = mainCheck.checked;
   var Chk = mainCheck;
   Parent = document.getElementById('GridParents');
   for (i = 1; i < Parent.rows.length; i++) {
      var items = Parent.rows[i].children[1];
      if (items.checked != IsChecked) {
      items.click();
      }
   }
}
</script>

 

note: 

parent.rows[I].children[1] is the checkbox, I add .click() function to it, but checkbox remain the same 

 

Please Help. Thanks