GridView CheckBox Select All using VB.Net

In ASP.Net web pages, GridView Checkbox select all functionality is a very common feature of modern websites. Live examples of select all GridView checkbox controls 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 checkbox controls placed inside the Gridview column or JavaScript client end script code to select the checkboxes without page refresh or page postback. In this tutorial we will discuss the VB.Net server end code to select all checkboxes placed inside the GridView control. First of all you need to setup the GridView layout with checkbox controls placed inside its ItemTemplate column.

HTML Code for ASP.Net GridView with CheckBox Controls

<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" 
            HeaderStyle-HorizontalAlign="Left">
            <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" BackColor="#f0f0f0" />
</asp:GridView>

In the above HTML code we have added two checkboxes inside the GridView control. 1st checkbox control has been placed inside the HeaderTemplate of TemplateField column. This checkbox will perform the action 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 VB.Net server end method code for Select All checkbox controls placed inside the header. 

VB.Net Code GridView Checkbox Select All At Once

Protected Sub chkSelectAll_CheckedChanged(ByVal sender As Object, ByVal e As System.EventArgs)

    Dim chk As CheckBox

    For Each rowItem As GridViewRow In GridView1.Rows
        chk = CType(rowItem.Cells(0).FindControl("chk1"), CheckBox)
        chk.Checked = CType(sender, CheckBox).Checked
    Next

End Sub

Above VB.Net code shows how to find a checkbox control placed inside the each row of GridView control and access its Checked property to set the checkbox state accordingly. CType(sender, CheckBox).Checked code has been used to get the state of checkbox placed inside the HeaderTemplate of TemplateField column.

Continue to next tutorial: GridView CheckBox Select All using JavaScript and VB.Net to learn how to select all the checkbox controls placed inside the GridView control using JavaScript and VB.Net code without refreshing the web ASP.net page