check all uncheck all linkbutton not working when gridview is inside updatepanel

Question

I can't seem to get checkAll and uncheckAll linkbutton functionality working using javascript when my gridview is inside updatepanel

   <asp:LinkButton ID="LinkButton1" runat="server" Text="Check All" OnClientClick="CheckOrUnCheckAll(true);return false;"></asp:LinkButton>
                    <asp:LinkButton ID="LinkButton2" runat="server" Text="Uncheck All" OnClientClick="CheckOrUnCheckAll(false);return false;"></asp:LinkButton>
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                        <ContentTemplate>
                            <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1"
                                ShowHeaderWhenEmpty="True" EmptyDataText="No Uploads are found" ShowEmptyTable="True"
                                ShowFooterWhenEmpty="False" Style="margin-top: 20px" OnSelectedIndexChanged="GridView2_SelectedIndexChanged"
                                OnRowDataBound="GridView2_RowDataBound" OnRowCommand="GridView2_RowCommand" DataKeyNames="Id"
                                PageSize="8" AllowPaging="True" AlternatingRowStyle-BackColor="#C2D69B">
                                <AlternatingRowStyle BackColor="#C2D69B"></AlternatingRowStyle>
                                <Columns>
                                    <asp:TemplateField HeaderText="Select">
                                        <HeaderTemplate>
                                            <asp:CheckBox ID="checkAll" runat="server" onclick="checkAll(this)" AutoPostBack="True" />
                                        </HeaderTemplate>
                                        <ItemTemplate>

                                            <asp:CheckBox ID="CheckBox1" runat="server" onclick="Check_Click(this)" AutoPostBack="True" />
                                        </ItemTemplate>
                                    </asp:TemplateField>

Answer 1

Try the following javascript function:

 function SelectAll(chk)
        {
            //get reference of GridView control
            var grid = document.getElementById("<%= GridView1.ClientID %>");
            //variable to contain the cell of the grid
            var cell;

            if (grid.rows.length > 0)
            {
                //loop starts from 1. rows[0] points to the header.
                for (i=1; i<grid.rows.length; i++)
                {
                    //get the reference of first column
                    cell = grid.rows[i].cells[0];

                    //loop according to the number of childNodes in the cell
                    for (j=0; j<cell.childNodes.length; j++)
                    {           
                        //if childNode type is CheckBox                 
                        if (cell.childNodes[j].type =="checkbox" && cell.childNodes[j].id.indexOf('chkSel')!=-1)
                        {
                        //assign the status of the Select All checkbox to the cell checkbox within the grid
                            cell.childNodes[j].checked = chk;
                        }
                    }
                }
            }
        }

Try the following aspx code:

<asp:LinkButton ID="lnkCheck" Text="Check all" OnClientClick=" SelectAll(true); return false;"
                runat="server"></asp:LinkButton><br />
            <asp:LinkButton ID="lnkUncheck" Text="Uncheck all" OnClientClick=" SelectAll(false); return false;"
                runat="server"></asp:LinkButton><br />
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <asp:GridView ID="GridView1" AutoGenerateColumns="false" runat="server">
                        <Columns>
                            <asp:TemplateField HeaderText="CategoryID">
                                <HeaderTemplate>
                                    Select
                                    <asp:CheckBox ID="chkAll" runat="server" onclick="SelectAll(this.checked);" />
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <asp:CheckBox ID="chkSel" runat="server" />
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:TemplateField HeaderText="CategoryID">
                                <ItemTemplate>
                                    <asp:CheckBox ID="chkOther" runat="server" />
                                </ItemTemplate>
                            </asp:TemplateField>

                            <asp:TemplateField HeaderText="Category">
                                <ItemTemplate>
                                    <asp:LinkButton ID="lnkID" runat="server" CommandName="sel" CommandArgument='<%# DataBinder.Eval(Container,"DataItem.CategoryID") %>'
                                        Text='<%# DataBinder.Eval(Container,"DataItem.CategoryName") %>'></asp:LinkButton>
                                </ItemTemplate>

                            </asp:TemplateField>

                        </Columns>
                    </asp:GridView>

                </ContentTemplate>
            </asp:UpdatePanel>