Paging Repeater Control using PagedDataSource

Paging large database result sets is very important and common feature in modern websites. For ASP.NET developers, Microsoft has build paging functionality into the GridView control by default and developers just have to set some simple properties true and that’s all they need to have paging in their websites. Many developers prefer Repeater or DataList control over GridView due to its large overhead. In this tutorial, I will show you how you can do paging using light weight ASP.NET Repeater control and PagedDataSource class.

The PagedDataSource class

This class is available in System.Web.UI.WebControls namespace, so you don’t have to import any additional namespace to the ASP.NET page. This class provides you facility to add paging functionality to DataList, Repeater or any other control. It encapsulates all the functionality of GridView paging and if you have ever used GridView paging, you will find the following properties of this class very familiar to you.

• AllowPaging – This Boolean property determines whether the paging should be enabled or disabled. By default it is set to false.
• PageSize – This property defines how many records to display on a page. The default value is 10.
• CurrentPageIndex – This property returns or set the current page number. By default it returns 0.
• PageCount – This property returns the total number of pages
• DataSource – The value of this property will be the source of the data you want to page. i.e. DataTable.
• IsFirstPage – This property returns true or false depending on whether the current page is the first page.
• IsLastPage – This property returns true or false depending on whether the current page is the last page.

Now you have basic idea of important properties of PagedDataSource class I am showing you live working example how to use this class to implement paging with Repeater control. Following code is HTML source of the ASP.NET page showing you a simple Repeater control with Header, Footer and ItemTemplate. All three templates are creating a simple HTML table to make it look like GridView control.

<asp:Label ID="Label1" runat="server" Font-Bold="True" />
<br />
<br />
<asp:Repeater ID="Repeater1" runat="server">
   <HeaderTemplate>
      <table border="1" style="border-color: #336699;" cellspacing="0">               
         <tr style="background-color:#336699; color:White;">
            <td>Product ID</td>
            <td>Product Name</td>
            <td>Unit Price</td>
         </tr>
   </HeaderTemplate>
   <ItemTemplate>
         <tr>
            <td><%# Eval("ProductID") %></td>
            <td><%# Eval("ProductName") %></td>
            <td><%# Eval("UnitPrice") %></td>
         </tr>
   </ItemTemplate>
   <FooterTemplate>
      </table>
   </FooterTemplate>
</asp:Repeater> 

<br />
           
<asp:HyperLink ID="linkPrev" runat="server">Previous Page</asp:HyperLink>
<asp:HyperLink ID="linkNext" runat="server">Next Page</asp:HyperLink>

You must notice Label control and two HyperLink controls. These controls are not part of the Repeater control and are placed outside Repeater control. The Label control will show user current page and total number of pages and hyper link controls will provide Next and Previous page functionality.

Following is the C# code behind file for the above page. For brevity I am putting all the code in Page_Load event of the page.

protected void Page_Load(object sender, EventArgs e) 
{ 
  if (!Page.IsPostBack)
  { 
     string constr = "Server=.\\SQLEXPRESS; Database=NORTHWND; uid=test; pwd=test"; 
     string query = "SELECT * FROM Products"; 
     SqlDataAdapter da = new SqlDataAdapter(query, constr); 
     DataTable table = new DataTable(); 
     da.Fill(table); 

     PagedDataSource pds = new PagedDataSource(); 
     pds.DataSource = table.DefaultView; 
     pds.AllowPaging = true; 
     pds.PageSize = 5; 

     int currentPage; 

     if (Request.QueryString["page"] != null) 
     { 
         currentPage = Int32.Parse(Request.QueryString["page"]); 
     } 
     else 
     { 
         currentPage = 1; 
     } 
     
     pds.CurrentPageIndex = currentPage - 1; 
     Label1.Text = "Page " + currentPage + " of " + pds.PageCount; 

     if (!pds.IsFirstPage) 
     { 
         linkPrev.NavigateUrl = Request.CurrentExecutionFilePath + "?page=" + (currentPage - 1); 
     } 
     
     if (!pds.IsLastPage) 
     { 
         linkNext.NavigateUrl = Request.CurrentExecutionFilePath + "?page=" + (currentPage + 1); 
     } 

     Repeater1.DataSource = pds; 
     Repeater1.DataBind(); 
   } 
}

Explanation

I am using Microsoft’s very popular Northwind database for this example and first few lines in the above code are filling a DataTable object by using ADO.NET SqlDataAdapter object

string constr = "Server=.\\SQLEXPRESS; Database=NORTHWND; uid=test; pwd=test"; 
string query = "SELECT * FROM Products"; 
SqlDataAdapter da = new SqlDataAdapter(query, constr); 
DataTable table = new DataTable(); 
da.Fill(table);

The following code creates an instance of PagedDataSource class and sets some basic properties.

PagedDataSource pds = new PagedDataSource(); 
pds.DataSource = table.DefaultView; 
pds.AllowPaging = true; 
pds.PageSize = 5;

The following code is checks the current page number in query string and then sets the CurrentPageIndex property of PagedDataSource accordingly.

if (Request.QueryString["page"] != null) 
{ 
   currentPage = Int32.Parse(Request.QueryString["page"]); 
} 
else 
{ 
  currentPage = 1; 
}

pds.CurrentPageIndex = currentPage - 1;
Label1.Text = "Page " + currentPage + " of " + pds.PageCount;

Following code updates Next and Previous pages links dynamically. It also checks whether the current page is first or last page.

if (!pds.IsFirstPage) 
{ 
    linkPrev.NavigateUrl = Request.CurrentExecutionFilePath + "?page=" + (currentPage - 1); 
} 

if (!pds.IsLastPage)
{ 
    linkNext.NavigateUrl = Request.CurrentExecutionFilePath + "?page=" + (currentPage + 1); 
}

Last two lines in the code are binding PagedDataSource instance with Repeater control.

Repeater1.DataSource = pds; Repeater1.DataBind();

I hope some ASP.NET developers will find this tutorial very useful and I am sure for many of you PagedDataSource is totally new object. .NET Framework is full of many useful classes to make your life easier. It’s just a matter of knowing and working with them. I will recommend you to visit .NET Framework SDK documentation regularly to keep yourself up to date.