CheckBox header to select all checkBoxes in SPGridView

Question

I have a webpart with SpGridView.

<SharePoint:SPGridView ID="grid" AllowSorting="true" AllowFiltering="true" CssClass="ms-listviewtable"
runat="server" AutoGenerateColumns="false" AllowPaging="True" HeaderStyle-Width="20px" >

 <Columns>
       <asp:TemplateField>
        <ItemTemplate>
            <asp:CheckBox ID="select" runat="server" />
           </ItemTemplate>
        <HeaderTemplate>
        <asp:CheckBox ID="selectionCheckBoxHeader" runat="server" OnClick="checkAllCheckBoxes(this)" />
        </HeaderTemplate>

       </asp:TemplateField>
 </Columns>

I add checkbox to header for select all rows of SpGridView.

I use javascrpt for select all.

function checkAllCheckBoxes(invoker) {  
var gridView = document.getElementById('<%# grid.ClientID %>');
for (var i = 1; i < gridView.rows.length; i++) {
    var rowElement = gridView.rows[i].cells[0];
    for (var j = 0; j < rowElement.childNodes.length; j++) {
        if (rowElement.childNodes[j].type == "checkbox") {
            rowElement.childNodes[j].checked = invoker.checked;
        }
    }            
}
  }

Problem is :

getElementById don't find SpGrid !!!

Answer 1

I found it. I changed the code:

protected void grid_RowDataBound(object sender, GridViewRowEventArgs e)
{
  if(e.Row.RowType==DataControlRowType.DataRow)
  {
    CheckBox cb = e.Row.Cells[0].FindControl("selectionCheckBoxHeader") as CheckBox;

   cb.Attributes.Add("onclick", "checkBoxChange(this,"+grid.ClientID+")");
  }

}