Select All Checkbox feature in gridview not being implemented

I am having header in gridview that labels as "xls" and a checkbox, that when selected should select all the checkbox columns in gridview and unchecking the xls column should uncheck all the columns.

I am following two links:

Link-1

Here, the totalChkBoxes variable is coming null (despite my gridview has rows). In fact when debugging the JS, code inside parseInt and below line is coming as ''

Link-2

Here also the GridView2 variable is coming null.

One common change that i am doing in both the JS is replacing the <%=.....%> by <%#....%>

Please guide as to what i am doing wrong. You can also help by giving some suitable link to implement the desired 开发者_运维百科functionality

CODE UPDATED WITH MY WORKING JS

<script type="text/javascript" language="javascript">

    function checkAllBoxes() {            
        var gvControl = document.getElementById("gvSample");

        //this is the checkbox in the item template.
        var gvChkBoxControl = "chkSelectItem";

        //Header Template checkbox.
        var mainChkBox = document.getElementById("chkBoxAll");

        //Array of Inputs in gridview.
        var inputTypes = gvControl.getElementsByTagName("input");

        for (var i = 0; i < inputTypes.length; i++) {
            //if the input type is a checkbox and the id of it is what we set above
            //then check or uncheck according to the main checkbox in the header template             
            if (inputTypes[i].type == 'checkbox' && inputTypes[i].id.indexOf(gvChkBoxControl, 0) >= 0)
                inputTypes[i].checked = mainChkBox.checked;
        }
    }

GRIDVIEW CODE

<asp:TemplateField>
                                                    <HeaderTemplate>
                                                        <table style="width: 15px" cellpadding="0" cellspacing="0">
                                                            <tr>
                                                                <td>
                                                                   <asp:Label ID="lblXls" runat="server" Text="xls"></asp:Label>
                                                                   <br />
                                                                        <input id="chkBoxAll" type="checkbox" onclick="checkAllBoxes()"  />
                                                                </td>
                                                             </tr>
                                                         </table>
                                                    </HeaderTemplate>
                                                    <ItemTemplate>
                                                        <asp:CheckBox ID="chkSelectItem" runat="server" />
                                                    </ItemTemplate>
                                                </asp:TemplateField>

Thanks!

---

Try changing your parseInt to something like this to see if it helps at all. I know it's only a small change, but small things tend to break JS code:

var totalChkBoxes = parseInt("<%=gvTest.Rows.Count%>");

Secondly, if you have runat="server" on the checkbox in the header, you may need to change this line if your JSFunction:

var mainChkBox = document.getElementById("<%=chkBoxAll.UniqueID%>");