Friday, 8 April 2016

ASP.Net GridView header checkbox select or deselect using server side

In this article, we will learn how to select all checkboxes of GridView row when header checkbox is selected/checked and deselect/uncheck header checkbox when any of row checkbox is deselected/unchecked using server side c# code.

Output

When you select header checkbox then all the row checkboxes will get select as shown below.

select deselect checkboxes header

When you will select any row checkbox then header checkbox will be unchecked.

select deselect item row

In Designer File

In designer file, create a gridview control grdEmployee with required header and row checkbox in HeaderTemplate and ItemTemplate respectively as shown in code. Generate OnCheckedChanged events for both checkboxes.

<form id="form1" runat="server">
<div align="center">
<asp:GridView ID="grdEmployee" runat="server" AutoGenerateColumns="False" AllowPaging="true"
    ShowFooter="true" PageSize="5" BorderColor="SkyBlue">
    <HeaderStyle BackColor="#00A6DC" ForeColor="White" />
    <Columns>
        <asp:TemplateField>
            <HeaderTemplate>
                <asp:CheckBox ID="chkHeader" runat="server" AutoPostBack="true" 
                OnCheckedChanged="chkHeader_CheckedChanged" ></asp:CheckBox>
            </HeaderTemplate>

            <ItemTemplate>
                <asp:CheckBox ID="chkRow" runat="server" AutoPostBack="true" 
                OnCheckedChanged="chkRow_CheckedChanged"> </asp:CheckBox>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Employee Id">
            <ItemTemplate>
                <asp:Label ID="lblEmpId" runat="server" Text='<%#Eval("EmpId") %>'>
                </asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Employee Name">
            <ItemTemplate>
                <asp:Label ID="lblEmpName" runat="server" Text='<%#Eval("EmpName") %>'>
                </asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Employee Address">
            <ItemTemplate>
                <asp:Label ID="lblEmpAddress" runat="server" Text='<%#Eval("EmpAddress") %>'>
                </asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
</div>
</form>

Namespace Used

Include the below Namespaces.

using System.Data;

Complete C# Code

On page load, bind gridview control by calling BindGrid() method so that gridview must have some data.

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        grdEmployee.DataSource = BindGrid();
        grdEmployee.DataBind();
    }
}

public DataTable BindGrid()
{
    //Creating DataTable 
    DataTable dt = new DataTable();
    //adding Columns to DataTable
    dt.Columns.Add("EmpId", typeof(Int32));
    dt.Columns.Add("EmpName", typeof(string));
    dt.Columns.Add("EmpAddress", typeof(string));
    //Addding data to DataTable         
    dt.Rows.Add(1, "Rahul", "Delhi");
    dt.Rows.Add(2, "John", "Mumbai");
    dt.Rows.Add(3, "Ravi", "Chennai");
    dt.Rows.Add(4, "Ram", "Kolkata");
    return dt;

}

protected void chkHeader_CheckedChanged(object sender, EventArgs e)
{
    CheckBox chkHeader = (CheckBox)grdEmployee.HeaderRow.FindControl("chkHeader");
    if (chkHeader.Checked)
    {
        foreach (GridViewRow gvrow in grdEmployee.Rows)
        {
            CheckBox chkRow = (CheckBox)gvrow.FindControl("chkRow");
            chkRow.Checked = true;
        }
    }
    else
    {
        foreach (GridViewRow gvrow in grdEmployee.Rows)
        {
            CheckBox chkRow = (CheckBox)gvrow.FindControl("chkRow");
            chkRow.Checked = false;
        }
    }

}

protected void chkRow_CheckedChanged(object sender, EventArgs e)
{
    int count = 0;
    int totalRowCountGrid = grdEmployee.Rows.Count;

    CheckBox chkHeader = (CheckBox)grdEmployee.HeaderRow.FindControl("chkHeader");

    foreach (GridViewRow gvrow in grdEmployee.Rows)
    {
        CheckBox chkRow = (CheckBox)gvrow.FindControl("chkRow");
        if (chkRow.Checked)
        {
            count++;
        }
    }

    if (count == totalRowCountGrid)
    {
        chkHeader.Checked = true;
    }
    else
    {
        chkHeader.Checked = false;
    }

}
Share:

0 comments:

Post a Comment

Email Subscription

Subscribe to our newsletter to get the latest articles directly into your inbox

Blog Archive

BUY FROM AMAZON