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
  • Rate / Review ▼

    • Give your Feedback:

      Rate this demo:


ListView / Basic sorting

Configure this demo
Maria Anders
Alfreds Futterkiste
Berlin
Germany
030-0074321
Ana Trujillo
Ana Trujillo Emparedados y helados
México D.F.
Mexico
(5) 555-4729
Antonio Moreno
Antonio Moreno Taquería
México D.F.
Mexico
(5) 555-3932
Thomas Hardy
Around the Horn
London
UK
(171) 555-7788
Christina Berglund
Berglunds snabbköp
Luleå
Sweden
0921-12 34 65
Hanna Moos
Blauer See Delikatessen
Mannheim
Germany
0621-08460
Frédérique Citeaux
Blondesddsl père et fils
Strasbourg
France
88.60.15.31
Martín Sommer
Bólido Comidas preparadas
Madrid
Spain
(91) 555 22 82
Laurence Lebihan
Bon app'
Marseille
France
91.24.45.40

  • RadListView for ASP.NET AJAX provides integrated sorting capabilities which can be triggered by:
    • link/push/image buttons residing in the RadListView body when its AllowSorting property is set to true. Their CommandName should be set to 'Sort' and CommandArgument must match the name of the underlying source field to be sorted (for example ContactName for Customers Northwind table).
    • controls outside of the listview body which invoke the FireCommandEvent method of the listview control. Refer to the DataBinding -> Simple vs Advanced binding demo for details on this approach.

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="c#" Inherits="Telerik.ListViewExamplesCSharp.Sorting.BasicSorting.DefaultCS"
        CodeFile="DefaultCS.aspx.cs" %>

    <%@ 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>
        <link href="RadListView.css" rel="stylesheet" type="text/css" />
    </head>
    <body class="BODY">
        <form runat="server" id="mainForm" method="post">
        <div>
            <telerik:Header runat="server" ID="Header2" NavigationLanguage="CS" ShowSkinChooser="false" />
            <!-- content start -->
            <telerik:RadScriptManager ID="ScriptManager1" runat="server" EnableTheming="True" />
            <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All"
                Skin="Sunset" />
            <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
                <div style="width: 730px">
                    <div class="bigModule">
                        <div class="bigModuleBottom" style="line-height: 30px; font-size: 11pt; font-weight: bold;">
                            <div class="boxStyle">
    <asp:CheckBoxList ID="CheckBoxList1" runat="server" RepeatDirection="Horizontal"
    AutoPostBack="true">
                                    <asp:ListItem Text="CompanyName" />
                                    <asp:ListItem Text="City" />
                                    <asp:ListItem Text="ContactName" />
                                    <asp:ListItem Text="Country" />
                                </asp:CheckBoxList>
    <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal"
    AutoPostBack="true" Visible="false">
                                    <asp:ListItem Text="CompanyName" />
                                    <asp:ListItem Text="City" />
                                    <asp:ListItem Text="ContactName" />
                                    <asp:ListItem Text="Country" />
                                </asp:RadioButtonList>
                            </div>
                            <div class="boxStyle">
                                <asp:Button ID="Button1" runat="server" Width="122px" Text="Ascending" OnClick="Button1_Click" />
                                <asp:Button ID="Button2" runat="server" Width="122px" Text="Descending" OnClick="Button1_Click" />
                                <asp:Button ID="Button3" runat="server" Width="122px" Text="None" OnClick="Button1_Click" />
                            </div>
                        </div>
                    </div>
                    <telerik:ConfiguratorPanel runat="server" ID="ConfigurationPanel1" Title="Configure this demo"
                        Expanded="false">
                        <div class="boxStyle" style="padding-left: 3px">
    <asp:CheckBox ID="CheckBox1" runat="server" Text="Allow multiple sorting" Checked="true"
    AutoPostBack="true" OnCheckedChanged="CheckBox1_CheckedChanged" />
                            <p>
                            </p>
                            Sort expression:
                            <asp:Label ID="Label1" runat="server" Text=" " />
                        </div>
                    </telerik:ConfiguratorPanel>
                </div>
                <telerik:RadListView ID="RadListView1" runat="server" ItemPlaceholderID="PlaceHolder1"
                    DataSourceID="SqlDataSource1" AllowMultiFieldSorting="true" AllowPaging="true">
                    <ItemTemplate>
                        <div class="itemStyle">
                            <asp:Label ID="CustomerLabel" runat="server" Text='<%# Eval("CustomerID") %>' Visible="false" />
                            <asp:Label CssClass="labelLarge" ID="ContactNameLabel" runat="server" Text='<%# Eval("ContactName") %>' />
                            <div class="labelSmall">
                                <asp:Label ID="CompanyNameLabel" runat="server" Text='<%# Eval("CompanyName") %>' /><br />
                                <asp:Label ID="CityLabel" runat="server" Text='<%# Eval("City") %>' /><br />
                                <asp:Label ID="CountryLabel" runat="server" Text='<%# Eval("Country") %>' /><br />
                            </div>
                            <div class="labelPhone">
                                <asp:Label ID="PhoneLabel" runat="server" Text='<%# Eval("Phone") %>' />
                            </div>
                        </div>
                    </ItemTemplate>
                    <LayoutTemplate>
                        <div class="listLayout">
                            <asp:Panel ID="PlaceHolder1" runat="server" />
                            <telerik:RadDataPager ID="RadDataPager1" runat="server" PagedControlID="RadListView1"
                                Skin="Sunset" PageSize="9" Style="clear: both;" Width="720px">
                                <Fields>
                                    <telerik:RadDataPagerButtonField FieldType="FirstPrev" FirstButtonText="First" PrevButtonText="Prev" />
                                    <telerik:RadDataPagerButtonField FieldType="Numeric" PageButtonCount="10" />
                                    <telerik:RadDataPagerButtonField FieldType="NextLast" NextButtonText="Next" LastButtonText="Last" />
                                </Fields>
                            </telerik:RadDataPager>
                        </div>
                    </LayoutTemplate>
                </telerik:RadListView>
            </telerik:RadAjaxPanel>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
                SelectCommand="SELECT [CustomerID], [CompanyName], [City], [ContactName], [Country], [Phone] FROM [Customers]" />
            <!-- content end -->
            <telerik:Footer runat="server" ID="Footer1" />
        </div>
        </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