ASP.Net GridView Checkbox Select All using C#

In ASP.Net web pages, GridView Checkbox select all functionality is a very common feature of modern websites. Live examples of ASP.Net GridView Checkbox select all functionality these days is online dating, community or social bookmarking websites like mySpace.com, Hi5.com etc. where a user can select all the checkboxes with a single click to select his friends list. This functionality of ASP.Net GridView Checkbox select all at once can be achieved by two types of codes. You can use server end code to select all the checkboxes placed inside the ASP.Net Gridview column or javascript client end script code to select the checkboxes without page refresh or page postback. In this tutorial we will discuss C# server end code to select all checkboxes placed inside the GridView control. First of all you need to setup the GridView layout with checkbox server control placed inside the ItemTemplate column. 

HTML Code for ASP.Net GridView Checkbox Layout

<asp:GridView ID="GridView1" 
    runat="server" 
    AutoGenerateColumns="False" 
    BorderStyle="Solid"
    CellPadding="4" 
    DataKeyNames="CategoryID" 
    BorderColor="Silver" 
    BorderWidth="1px"
    Width="300px">
    <Columns>
        <asp:TemplateField HeaderText="Categories">
            <HeaderTemplate>
                <asp:CheckBox ID="chkSelectAll" 
                    runat="server" 
                    Text="SelectAll" 
                    AutoPostBack="true"
                    OnCheckedChanged="chkSelectAll_CheckedChanged" />
            </HeaderTemplate>
            <ItemTemplate>
                <asp:CheckBox ID="chk1" 
                    runat="server" 
                    Text='<%# DataBinder.Eval( Container.DataItem,"categoryID" ) + " " + DataBinder.Eval( Container.DataItem,"categoryName" ) %>' />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
    <HeaderStyle HorizontalAlign="Left" />
</asp:GridView>

In the above HTML code we have added two checkboxes inside the GridView control. 1st checkbox control has been added inside the HeaderTemplate of TemplateField column. This checkbox will perform the function to select all the checkboxes rendered in the row items of GridView. 2nd checkbox has been placed inside the ItemTemplate of same TemplateField column that will generate row items like a checkbox list. In the above HTML code you can see that two additional properties of checkbox have been used for the checkbox placed inside the HeaderTemplate. AutoPostback="true" property enables the checkbox control to execute the associated server end method code, for example chkSelectAll_CheckedChanged server code method in the above sample associated with onCheckedChanged event of checkbox. Now next step is to add C# server end method code for Select All checkbox control placed inside the header. 

C# code for ASP.Net GridView Checkbox Select All Function

protected void chkSelectAll_CheckedChanged(object sender, EventArgs e)
{
    CheckBox chk;
    foreach (GridViewRow rowItem in GridView1.Rows)
    {
        chk = (CheckBox)(rowItem.Cells[0].FindControl("chk1"));
        chk.Checked =((CheckBox)sender).Checked;
    }
}

Above C# code shows that how to find checkbox control placed inside the each row of GridView control and access its Checked property to set the checkbox state accordingly. ((Checkbox) sender).Checked code has been used to get the state of checkbox placed inside the HeaderTemplate of TemplateField column.

In the next tutorial: ASP.Net GridView Checkbox Select All using Javascript you will learn the same funcitonality to select all the checkbox controls placed inside the GridView control but using JavaScript code.