function SelectheaderCheckboxes(headerchk) {
// debugger;
var gvcheck = document.getElementById('<% =GridView1.ClientID%>');
var i;
//Condition to check header checkbox selected or not if that is true checked all checkboxes
if (headerchk.checked) {
for (i = 0; i < gvcheck.rows.length; i++) {
var inputs = gvcheck.rows[i].getElementsByTagName('input');
if (inputs != null && inputs.length != 0)
inputs[0].checked = true;
}
}
//if condition fails uncheck all checkboxes in gridview
else {
for (i = 0; i < gvcheck.rows.length; i++) {
var inputs = gvcheck.rows[i].getElementsByTagName('input');
if (inputs != null && inputs.length != 0)
inputs[0].checked = false;
}
}
}
//function to check header checkbox based on child checkboxes condition
function Selectchildcheckboxes(header) {
var ck = header;
var count = 0;
var gvcheck = document.getElementById('<% =GridView1.ClientID%>');
var headerchk = document.getElementById(header);
var rowcount = gvcheck.rows.length;
//By using this for loop we will count how many checkboxes has checked
for (i = 1; i < gvcheck.rows.length; i++) {
var inputs = gvcheck.rows[i].getElementsByTagName('input');
if (inputs != null && inputs.length != 0)
if (inputs[0].checked) {
count++;
}
}
//Condition to check all the checkboxes selected or not
if (count == rowcount - 1) {
headerchk.checked = true;
}
else {
headerchk.checked = false;
}
}
gridview design
<asp:GridView ID="GridView1" AutoGenerateColumns="false" runat="server" ShowFooter="false"
DataKeyNames="Employee_ID" AllowPaging="false" CssClass="gridstyle" OnRowDataBound="GridView1_OnRowDataBound"
HorizontalAlign="Center" Width="80%" EmptyDataText="Record Not found!">
<RowStyle HorizontalAlign="Center" CssClass="even" />
<HeaderStyle CssClass="header-cell" />
<AlternatingRowStyle HorizontalAlign="Center" CssClass="odd" />
<Columns>
<asp:TemplateField HeaderText="S.No.">
<ItemTemplate>
<%#Container.DataItemIndex+1 %>
</ItemTemplate>
<HeaderStyle CssClass="header-cell" />
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<center>
<asp:CheckBox ID="chAllEmp" AutoPostBack="true" onclick="javascript:SelectheaderCheckboxes(this)"
Checked="true" runat="server" /></center>
</HeaderTemplate>
<HeaderStyle CssClass="header-cell" />
<ItemTemplate>
<asp:CheckBox ID="chEmp" AutoPostBack="true" onClick="javascript:SelectheaderCheckboxes(headerchk)"
Checked="true" runat="server" />
</ItemTemplate>
<HeaderStyle CssClass="header-cell" />
</asp:TemplateField>
<asp:TemplateField >
<HeaderTemplate>
<center >Employee Code</center>
</HeaderTemplate>
<ItemTemplate>
<asp:Label runat="server" ID="labEmployee_code" Visible="true" Text='<%#Bind("Employee_code") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField >
<HeaderTemplate>
<center >Employee Name</center>
</HeaderTemplate>
<ItemTemplate>
<asp:Label runat="server" ID="Label1" Visible="true" Text='<%#Bind("Employee_Name") %>'></asp:Label>
<asp:Label runat="server" ID="labempid" Visible="false" Text='<%#Bind("Employee_ID") %>'></asp:Label>
<asp:Label runat="server" ID="labrankid" Visible="false" Text='<%#Bind("Rank_ID") %>'></asp:Label>
<asp:Label runat="server" ID="lanLocation" Visible="false" Text='<%#Bind("Loc_Code") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<center > Days</center>
</HeaderTemplate>
<ItemTemplate>
<asp:TextBox runat="server" ID="txtAmount" Text="0" onkeypress="return numeralsOnly(event)" Width="100px"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
// debugger;
var gvcheck = document.getElementById('<% =GridView1.ClientID%>');
var i;
//Condition to check header checkbox selected or not if that is true checked all checkboxes
if (headerchk.checked) {
for (i = 0; i < gvcheck.rows.length; i++) {
var inputs = gvcheck.rows[i].getElementsByTagName('input');
if (inputs != null && inputs.length != 0)
inputs[0].checked = true;
}
}
//if condition fails uncheck all checkboxes in gridview
else {
for (i = 0; i < gvcheck.rows.length; i++) {
var inputs = gvcheck.rows[i].getElementsByTagName('input');
if (inputs != null && inputs.length != 0)
inputs[0].checked = false;
}
}
}
//function to check header checkbox based on child checkboxes condition
function Selectchildcheckboxes(header) {
var ck = header;
var count = 0;
var gvcheck = document.getElementById('<% =GridView1.ClientID%>');
var headerchk = document.getElementById(header);
var rowcount = gvcheck.rows.length;
//By using this for loop we will count how many checkboxes has checked
for (i = 1; i < gvcheck.rows.length; i++) {
var inputs = gvcheck.rows[i].getElementsByTagName('input');
if (inputs != null && inputs.length != 0)
if (inputs[0].checked) {
count++;
}
}
//Condition to check all the checkboxes selected or not
if (count == rowcount - 1) {
headerchk.checked = true;
}
else {
headerchk.checked = false;
}
}
gridview design
<asp:GridView ID="GridView1" AutoGenerateColumns="false" runat="server" ShowFooter="false"
DataKeyNames="Employee_ID" AllowPaging="false" CssClass="gridstyle" OnRowDataBound="GridView1_OnRowDataBound"
HorizontalAlign="Center" Width="80%" EmptyDataText="Record Not found!">
<RowStyle HorizontalAlign="Center" CssClass="even" />
<HeaderStyle CssClass="header-cell" />
<AlternatingRowStyle HorizontalAlign="Center" CssClass="odd" />
<Columns>
<asp:TemplateField HeaderText="S.No.">
<ItemTemplate>
<%#Container.DataItemIndex+1 %>
</ItemTemplate>
<HeaderStyle CssClass="header-cell" />
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<center>
<asp:CheckBox ID="chAllEmp" AutoPostBack="true" onclick="javascript:SelectheaderCheckboxes(this)"
Checked="true" runat="server" /></center>
</HeaderTemplate>
<HeaderStyle CssClass="header-cell" />
<ItemTemplate>
<asp:CheckBox ID="chEmp" AutoPostBack="true" onClick="javascript:SelectheaderCheckboxes(headerchk)"
Checked="true" runat="server" />
</ItemTemplate>
<HeaderStyle CssClass="header-cell" />
</asp:TemplateField>
<asp:TemplateField >
<HeaderTemplate>
<center >Employee Code</center>
</HeaderTemplate>
<ItemTemplate>
<asp:Label runat="server" ID="labEmployee_code" Visible="true" Text='<%#Bind("Employee_code") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField >
<HeaderTemplate>
<center >Employee Name</center>
</HeaderTemplate>
<ItemTemplate>
<asp:Label runat="server" ID="Label1" Visible="true" Text='<%#Bind("Employee_Name") %>'></asp:Label>
<asp:Label runat="server" ID="labempid" Visible="false" Text='<%#Bind("Employee_ID") %>'></asp:Label>
<asp:Label runat="server" ID="labrankid" Visible="false" Text='<%#Bind("Rank_ID") %>'></asp:Label>
<asp:Label runat="server" ID="lanLocation" Visible="false" Text='<%#Bind("Loc_Code") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<center > Days</center>
</HeaderTemplate>
<ItemTemplate>
<asp:TextBox runat="server" ID="txtAmount" Text="0" onkeypress="return numeralsOnly(event)" Width="100px"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>