New to Telerik UI for ASP.NET AJAXStart a free 30-day trial

Programmatic Pager Customization

You can replace the default pager programmatically with your own pager instance that holds the control set of your choice. This lets you provide a completely new look and feel for your pager while still using the integrated paging functionality of the grid.

To do this,

  1. Define your own class (such as the "MyPager" class in the following example) whose member variables are the controls you want displayed in the pager.
    • Include a GridPagingManager in your custom class. This object can be used in your class implementation to access the information from the PagerItem.Paging object. You can assign an instance of this object in the constructor of your class.
    • Include a GridTableView in your custom class for the table view that your pager operates on. You can assign an instance of this object in the constructor of your class.
    • Add any visual controls to the custom class for the controls that appear in your pager. These can be textboxes, validators, LiteralControls for messages, and so on. The creation of these controls should follow the ASP.NET conventions (overriding the CreateChildControls() method to instantiate and add your pager controls to the Controls collection of the respective class instance).
  2. Create a handler for the grid's ItemEvent event. When the event is "GridInitializePagerItem", cancel the default pager initialization and add an instance of your own class to the Controls collection of the PagerContentCell.
ASP.NET
<telerik:RadGrid RenderMode="Lightweight" ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1" Width="97%"
  AllowSorting="True" AllowPaging="True" Skin="Office2007" OnItemEvent="RadGrid1_ItemEvent">
  <MasterTableView Width="100%">
    <PagerStyle Mode="NumericPages" AlwaysVisible="true" />
  </MasterTableView>
</telerik:RadGrid>
 <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
      SelectCommand="SELECT * FROM [Customers]"></asp:SqlDataSource>
Not finding the help you need?
Contact Support