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 / Basic Paging

Example Configuration
Pager position:

Numeric pager:

Customer IDCompany NameContact NameContact TitleAddressPostal Code
12345678910...
 Page 1 of 19, items 1 to 5 of 91.
ALFKIAlfreds FutterkisteMaria AndersSales RepresentativeObere Str. 5712209
ANATRAna Trujillo Emparedados y heladosAna TrujilloOwnerAvda. de la Constitución 222205021
ANTONAntonio Moreno TaqueríaAntonio MorenoOwnerMataderos 231205023
AROUTAround the HornThomas HardySales Representative120 Hanover Sq.WA1 1DP
BERGSBerglunds snabbköpChristina BerglundOrder AdministratorBerguvsvägen 8S-958 22

Next/Previous buttons pager:

Customer IDCompany NameContact NameContact TitleAddressPostal Code
Change page:
 Page 1 of 19, items 1 to 5 of 91.
ALFKIAlfreds FutterkisteMaria AndersSales RepresentativeObere Str. 5712209
ANATRAna Trujillo Emparedados y heladosAna TrujilloOwnerAvda. de la Constitución 222205021
ANTONAntonio Moreno TaqueríaAntonio MorenoOwnerMataderos 231205023
AROUTAround the HornThomas HardySales Representative120 Hanover Sq.WA1 1DP
BERGSBerglunds snabbköpChristina BerglundOrder AdministratorBerguvsvägen 8S-958 22

Both numeric and Next/Previous buttons pager:

Customer IDCompany NameContact NameContact TitleAddressPostal Code
12345678910...
Page size:
select
 91 items in 19 pages
ALFKIAlfreds FutterkisteMaria AndersSales RepresentativeObere Str. 5712209
ANATRAna Trujillo Emparedados y heladosAna TrujilloOwnerAvda. de la Constitución 222205021
ANTONAntonio Moreno TaqueríaAntonio MorenoOwnerMataderos 231205023
AROUTAround the HornThomas HardySales Representative120 Hanover Sq.WA1 1DP
BERGSBerglunds snabbköpChristina BerglundOrder AdministratorBerguvsvägen 8S-958 22

  • You can familiarize with the basic paging capabilities of Telerik RadGrid from this online example. Pages can be changed by clicking on the page indicators in the footer.

    The paging functionality can be enabled by setting the AllowPaging property to true. The available settings are: PageSize, PagerPosition (Top, Bottom or TopAndBottom) and Mode (NextPrev or NumericPages). If sorting is enabled as well, paging operation will automatically retain the sort order and sort direction.
    Additionally, in order to display the grid pager regardless of the number of records returned and the page size, you should set the PagerStyle -> AlwaysVisible property of the corresponding GridTableView to true. Its default value is false.

    Furthermore, you can set only the format of the text that will appear in the Pager using the PagerTextFormat property. The default format is:

    Change page: {4} | Displaying page {0} of {1}, items {2} to {3} of {5}.

    The {0}, {1}, {2}, {3} and {4} parameters are mandatory when setting the property.
    • {0} is used to display current page number.
    • {1} is total number of pages.
    • {2} will be replaced with the number of the first item in the current page.
    • {3} will be set to the number of the last item in the current page.
    • {4} indicates where pager buttons would appear.
    • {5} corresponds to number of all items in the datasource.

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="c#" Inherits="Telerik.GridExamplesCSharp.GeneralFeatures.Paging.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>
    </head>
    <body class="BODY">
        <form runat="server" id="mainForm" method="post">
            <telerik:Header runat="server" ID="Header1" NavigationLanguage="CS"></telerik:Header>
          <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
            <!-- content start -->
            <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
                <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="RadGrid1">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                    <telerik:AjaxSetting AjaxControlID="RadGrid2">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadGrid2" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                    <telerik:AjaxSetting AjaxControlID="RadGrid3">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadGrid3" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                </AjaxSettings>
            </telerik:RadAjaxManager>
            
            <hr />
            <telerik:ConfiguratorPanel ID="ConfiguratorPanel1" runat="server" Expanded="true">

                    <span class="title">Pager position:</span>
    <asp:DropDownList ID="ddlPagerPosition" runat="server" AutoPostBack="true"
    OnSelectedIndexChanged="ddlPagerPosition_OnSelectedIndexChanged">
                        <asp:ListItem Text="Top" Value="Top"></asp:ListItem>
                        <asp:ListItem Text="Bottom" Value="Bottom"></asp:ListItem>
                        <asp:ListItem Text="TopAndBottom" Value="TopAndBottom"></asp:ListItem>
                    </asp:DropDownList>
            </telerik:ConfiguratorPanel>
            <hr />
            
            <p><strong>Numeric pager:</strong></p>
            <telerik:RadGrid ID="RadGrid1" DataSourceID="SqlDataSource1" AllowSorting="True"
                AllowPaging="True" PageSize="5" runat="server" GridLines="None" Width="100%">
                <PagerStyle Mode="NumericPages"></PagerStyle>
            </telerik:RadGrid>
            <br />
            <p>
                <strong>Next/Previous buttons pager:</strong></p>
            <telerik:RadGrid ID="RadGrid2" DataSourceID="SqlDataSource1" AllowSorting="True"
                AllowPaging="True" PageSize="5" runat="server" GridLines="None" Width="100%">
                <PagerStyle Mode="NextPrev"></PagerStyle>
            </telerik:RadGrid>
            <br />
            <p>
                <strong>Both numeric and Next/Previous buttons pager:</strong></p>
            <telerik:RadGrid ID="RadGrid3" DataSourceID="SqlDataSource1" AllowSorting="True"
                AllowPaging="True" PageSize="5" runat="server" GridLines="None" Width="100%">
                <PagerStyle Mode="NextPrevAndNumeric"></PagerStyle>
            </telerik:RadGrid>
            <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