Gridview headertemplate with checkbox and client side ( javascript) handling of select all / unselect all

Gridview headertemplate with checkbox and client side handling of select all / unselect all using javascript.
courtesy from
http://dotnetslackers.com/Community/blogs/kaushalparik/archive/2008/07/16/checkbox-in-headertemplate-to-select-all-checkboxes-inside-a-gridview-using-javascript.aspx

Idea and code from this site, I enhached and made small corrections this for my application, according to my requirement

Thanks to http://dotnetslackers.com/ for all the code.




        <div>

        <input type="hidden" id="hdnCheckBoxValue" />

            <table>

                <tr>

                    <td style="width: 100px;">

                        <asp:GridView ID="gvVendorBulletin">

                            <Columns>

                                <asp:TemplateField ItemStyle-HorizontalAlign="Center" ItemStyle-VerticalAlign="Middle"

                                    HeaderText="" ItemStyle-BorderWidth="0">

                                    <ItemTemplate>

                                        <asp:CheckBox ID="chkItem" runat="server" onclick="VendorItemSelected(this)" />

                                    </ItemTemplate>

                                    <HeaderTemplate>

                                        <asp:CheckBox ID="chkHdrItem" runat="server" onclick="VendorSelectAll(this)" />

                                    </HeaderTemplate>

                                </asp:TemplateField>

                            </Columns>

                        </asp:GridView>

                    </td>

                </tr>

            </table>

        </div>



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

function callFileDownload(a,b)

{

  function callCheckAllVendor(CheckBox) {



            TotalChkBx = parseInt('<%= this.gvVendorBulletin.Rows.Count %>');

            var TargetBaseControl = document.getElementById('<%= this.gvVendorBulletin.ClientID %>');

            var TargetChildControl = "chkItem";

            var Inputs = TargetBaseControl.getElementsByTagName("input");

            var flag = true;

            document.getElementById("hdnCheckBoxValue").value = true;

            for (var iCount = 0; iCount < Inputs.length; ++iCount) {

                if (Inputs[iCount].type == 'checkbox' && Inputs[iCount].id.indexOf(TargetChildControl, 0) >= 0) {

                    if (!Inputs[iCount].checked) {                      

                        flag = false;

                        document.getElementById("hdnCheckBoxValue").value = false;

                        return;

                    }

                }

            }           

        }

        function VendorSelectAll(CheckBox) {

            TotalChkBx = parseInt('<%= this.gvVendorBulletin.Rows.Count %>');

            var TargetBaseControl = document.getElementById('<%= this.gvVendorBulletin.ClientID %>');

            var TargetChildControl = "chkItem";

            var Inputs = TargetBaseControl.getElementsByTagName("input");

            for (var iCount = 0; iCount < Inputs.length; ++iCount) {

                if (Inputs[iCount].type == 'checkbox' && Inputs[iCount].id.indexOf(TargetChildControl, 0) >= 0)

                    Inputs[iCount].checked = CheckBox.checked;

            }

        }

        function VendorItemSelected(CheckBox) {



            TotalChkBx = parseInt('<%= this.gvVendorBulletin.Rows.Count %>');

            var TargetBaseControl = document.getElementById('<%= this.gvVendorBulletin.ClientID %>');

            var TargetChildControl = "chkHdrItem";

            var Inputs = TargetBaseControl.getElementsByTagName("input");                       

            if (!CheckBox.checked) {

                for (var iCount = 0; iCount < Inputs.length; ++iCount) {

                    if (Inputs[iCount].type == 'checkbox' && Inputs[iCount].id.indexOf(TargetChildControl, 0) >= 0)

                        Inputs[iCount].checked = CheckBox.checked;

                }

            }

            else {

                callCheckAllVendor(CheckBox);               

                var flags;

                if (document.getElementById("hdnCheckBoxValue").value == "true") {

                    flags = true;

                }

                else {

                    flags = false;

                }

                for (var iCount = 0; iCount < Inputs.length; ++iCount) {

                    if (Inputs[iCount].type == 'checkbox' && Inputs[iCount].id.indexOf(TargetChildControl, 0) >= 0)

                        Inputs[iCount].checked = flags;

                }

            }

        }

}

</script>