Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q1 2012 released 04/11/2012
select

Grid / Server-Side Row Selection

Selected rows count is: 0

   Customer IDCompany NameContact NameContact TitleAddressPostal Code
 Page 1 of 10, items 1 to 10 of 91.
SelectDeselect ALFKIAlfreds FutterkisteMaria AndersSales RepresentativeObere Str. 5712209
SelectDeselect ANATRAna Trujillo Emparedados y heladosAna TrujilloOwnerAvda. de la Constitución 222205021
SelectDeselect ANTONAntonio Moreno TaqueríaAntonio MorenoOwnerMataderos 231205023
SelectDeselect AROUTAround the HornThomas HardySales Representative120 Hanover Sq.WA1 1DP
SelectDeselect BERGSBerglunds snabbköpChristina BerglundOrder AdministratorBerguvsvägen 8S-958 22
SelectDeselect BLAUSBlauer See DelikatessenHanna MoosSales RepresentativeForsterstr. 5768306
SelectDeselect BLONPBlondesddsl père et filsFrédérique CiteauxMarketing Manager24, place Kléber67000
SelectDeselect BOLIDBólido Comidas preparadasMartín SommerOwnerC/ Araquil, 6728023
SelectDeselect BONAPBon app'Laurence LebihanOwner12, rue des Bouchers13008
SelectDeselect BOTTMBottom-Dollar MarketsElizabeth LincolnAccounting Manager23 Tsawassen Blvd.T2F 8M4


Click PostBack button to see that the state is preserved :  

  • A common scenario is to select/deselect a row with a select/deselect button or checkbox. This is a simple task using the event-bubbling mechanism in Telerik RadGrid. You just need to add two columns with the respective CommandName attribute:

    <Columns>
    <telerik:GridButtonColumn Text="Select" CommandName="Select"></telerik:GridButtonColumn>
    <telerik:GridButtonColumn Text="Deselect" CommandName="Deselect"></telerik:GridButtonColumn>
    </Columns>

    or configure the checkbox to select/deselect the row in its OnCheckedChanged server.

    The selected rows will be held server side in the SelectedItems collection of the RadGrid object. In addition, you can hook the SelectedIndexChanged server event of the grid to detect that item has been selected and perform additional operations if needed.

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="vb" AutoEventWireup="false" Inherits="Telerik.GridExamplesVBNET.Programming.SelectRowWithCheckBox.DefaultVB"
        CodeFile="DefaultVB.aspx.vb" %>

    <%@ Register TagPrefix="telerik" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="telerik" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <telerik:HeadTag runat="server" ID="Headtag2"></telerik:HeadTag>
    </head>
    <body class="BODY">
        <form runat="server" id="mainForm" method="post">
            <telerik:Header runat="server" ID="Header1" NavigationLanguage="VB"></telerik:Header>
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
            <!-- content start -->
                <telerik:RadAjaxManager ID="RadAjaxManager1" EnableAJAX="true" runat="server">
                    <AjaxSettings>
                        <telerik:AjaxSetting AjaxControlID="RadGrid1">
                            <UpdatedControls>
                                <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                                <telerik:AjaxUpdatedControl ControlID="Literal1" />
                            </UpdatedControls>
                        </telerik:AjaxSetting>
                    </AjaxSettings>
                </telerik:RadAjaxManager>
                
                <asp:Literal ID="Literal1" runat="server" />
                
                <telerik:RadGrid id="RadGrid1" DataSourceID="SqlDataSource1"
                 ShowStatusBar="true" runat="server" AllowPaging="True" AllowSorting="True"
                    AllowMultiRowSelection="True">
                    <MasterTableView PageSize="10">
                        <Columns>
                            <telerik:GridButtonColumn Text="Select" CommandName="Select">
                            </telerik:GridButtonColumn>
                            <telerik:GridButtonColumn Text="Deselect" CommandName="Deselect">
                            </telerik:GridButtonColumn>
                            <telerik:GridTemplateColumn UniqueName="CheckBoxTemplateColumn">
                                <HeaderTemplate>
                                 <asp:CheckBox id="headerChkbox" OnCheckedChanged="ToggleSelectedState" AutoPostBack="True" runat="server"></asp:CheckBox>
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <asp:CheckBox id="CheckBox1" OnCheckedChanged="ToggleRowSelection" AutoPostBack="True" runat="server"></asp:CheckBox>
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
                        </Columns>
                    </MasterTableView>
                    <ClientSettings EnableRowHoverStyle="true" />
                    <PagerStyle Mode="NumericPages"></PagerStyle>
                </telerik:RadGrid>
                    
                <br /><br />
                <telerik:PostBack ID="PostBack1" runat="server" />

    <asp:SqlDataSource ID="SqlDataSource1"
    ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"

                ProviderName="System.Data.SqlClient"
                SelectCommand="SELECT CustomerID, CompanyName, ContactName, ContactTitle, Address, PostalCode FROM Customers" runat="server">
            </asp:SqlDataSource>
             <!-- content end -->
            <telerik:Footer runat="server" ID="Footer1"></telerik:Footer>
        </form>
    </body>
    </html>

Get more than expected!

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2012 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451