Post
Ask Question

Paging in ASP.Net DataList

Background

I have often read the common question in forum posts of how to do paging in a DataList so by considering those requirements I have decided to write this article. In a DataList there is no direct method to do paging as in a GridView. To do paging in a DataList the PagedDataSource class provides the properties and methods to do the paging in the datalist. So let us start from the defination of PagedDataSource so beginners can also understand.
 
PagedDataSource
 
 PagedDataSource is a sealed class that provides the properties and methods to do paging and other tasks in the DataList.
 
Properties of  PagedDataSource
 
The following are (most of) the common properties of the PagedDataSource class:
  • AllowCustomPaging
  • AllowPaging
  • AllowServerPaging
  • Count
  • CurrentPageIndex
  • DataSource
  • DataSourceCount
  • FirstIndexInPage
  • IsCustomPagingEnabled
  • IsFirstPage
  • IsLastPage
  • IsPagingEnabled
  • IsReadOnly
  • IsServerPagingEnabled 
  • IsSynchronized
  • PageCount 
  • PageSize 
  • SyncRoot 
  • VirtualCount

Methods of PagedDataSource  

  • CopyTo
  • GetEnumerator
  • GetItemProperties
  • GetListName
I hope you have learned about the PagedDataSource. Now let us see the practice. Suppose we have an Employee table with the following records:
 
 
 
Now Let us create the sample web application as follows:
  1. "Start" - "All Programs" - "Microsoft Visual Studio 2010".
  2. "File" - "New WebSite" - "C#" - "Empty WebSite" (to avoid adding a master page).
  3. Provide the web site a name such as "PagingInDatList" or another as you wish and specify the location.
  4. Then right-click on the Solution Explorer and select "Add New Item" - Add Web Form.
  5. Drag and drop four Buttons and a DataList control onto the <form> section of the Default.aspx page.

Now the default.aspx Page source code will look such as follows.

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>  
  2.   
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  4.   
  5. <html xmlns="http://www.w3.org/1999/xhtml">  
  6. <head runat="server">  
  7.   <title>Article by Vithal Wadje</title>    
  8. </head>  
  9. <body bgcolor="navy">  
  10.     <form id="form1" runat="server">  
  11.   
  12.     <br />  
  13.         <br />  
  14.             <br />  
  15.     <div style="color:white">  
  16.       
  17.     <asp:DataList ID="EmpDataList" runat="server">  
  18.     <HeaderTemplate >  
  19.      <table  width="140%">  
  20.        <tr>  
  21.          <td width="10%">Id</td>  
  22.          
  23.            <td width="35%">Name</td>  
  24.            
  25.            <td width="25%"> City</td>  
  26.              <td width="30%"> Address</td>  
  27.             
  28.         </tr>  
  29.       
  30.       
  31.     </table>  
  32.       
  33.     </HeaderTemplate>  
  34.       <ItemTemplate  >  
  35.       <table width="140%">  
  36.        
  37.         <tr>  
  38.   
  39.            <td width="10%">  
  40.                <asp:Label  ID="Label1" runat="server" Text=<%#Eval("id")%>/>  
  41.              
  42.              
  43.            </td>  
  44.         <td width="35%">  
  45.         
  46.          <asp:Label ID="Label2" runat="server" Text=<%#Eval("Name")%>/>  
  47.           
  48.         </td>  
  49.          <td width="25%">  
  50.            
  51.            
  52.           <asp:Label ID="Label3" runat="server" Text=<%#Eval("City")%>/>  
  53.          </td>  
  54.          <td width="30%">  
  55.             
  56.            <asp:Label ID="Label4" runat="server" Text=<%#Eval("Address")%>/>  
  57.           </td>  
  58.           
  59.            
  60.         </tr>  
  61.         
  62.       </table>  
  63.         
  64.         </ItemTemplate>  
  65.       
  66.       
  67.     </asp:DataList>  
  68.    <table id="Paging" runat="server">  
  69.   <tr>  
  70.     <td>  
  71.         <asp:Button ID="Button1" runat="server" Font-Bold="true" Text="First"   
  72.             onclick="Button1_Click" style="height: 26px"   
  73.                      /></td>  
  74.         <td>  
  75.             <asp:Button ID="Button2" runat="server" Font-Bold="true" Text="Previous" onclick="Button2_Click"   
  76.                      /></td>  
  77.             <td>  
  78.                 <asp:Button ID="Button3" runat="server" Font-Bold="true" Text="Next" onclick="Button3_Click"   
  79.                      /></td>  
  80.                 <td>  
  81.                     <asp:Button ID="Button4" runat="server" Font-Bold="true" Text="Last" onclick="Button4_Click"   
  82.                    /></td>  
  83.     </tr>  
  84.    </table>  
  85.   
  86.   
  87.     </div>  
  88.     </form>  
  89. </body>  
  90. </html> 
The entire Default.aspx code will look as follows.
 
default.aspx.cs code
  1. using System;  
  2. using System.Data.SqlClient;  
  3. using System.Configuration;  
  4. using System.Data;  
  5. using System.Web.UI.WebControls;  
  6.   
  7. public partial class _Default : System.Web.UI.Page  
  8. {  
  9.   
  10.      
  11.     SqlConnection con;  
  12.     int CurrentPage;  
  13.     string  sqlconn;  
  14.     protected void Page_Load(object sender, EventArgs e)  
  15.     {  
  16.   
  17.         if (!IsPostBack)  
  18.         {  
  19.             BindDatList();  
  20.             ViewState["PageCount"] = 0;  
  21.         }  
  22.         CurrentPage = (int)ViewState["PageCount"];  
  23.     }  
  24.   
  25.    
  26.     private void connection()  
  27.     {  
  28.         sqlconn = ConfigurationManager.ConnectionStrings["SqlCom"].ConnectionString;  
  29.         con = new SqlConnection(sqlconn);  
  30.   
  31.     }  
  32.   
  33.     private void BindDatList()  
  34.     {  
  35.         connection();  
  36.         SqlCommand com = new SqlCommand("GetEmp", con);  
  37.         com.CommandType = CommandType.StoredProcedure;  
  38.         SqlDataAdapter da = new SqlDataAdapter(com);  
  39.         DataTable dt = new DataTable();  
  40.         con.Open();  
  41.         da.Fill(dt);  
  42.         con.Close();  
  43.   
  44.         DataListPaging(dt);  
  45.       
  46.       
  47.     }  
  48.   
  49.     private void DataListPaging(DataTable dt)  
  50.     {  
  51.         //creating object of PagedDataSource;  
  52.   
  53.   
  54.         PagedDataSource PD = new PagedDataSource();  
  55.   
  56.         PD.DataSource = dt.DefaultView;  
  57.         PD.PageSize = 2;  
  58.         PD.AllowPaging = true;  
  59.         PD.CurrentPageIndex = CurrentPage;  
  60.         Button1.Enabled = !PD.IsFirstPage;  
  61.         Button2.Enabled = !PD.IsFirstPage;  
  62.         Button4.Enabled = !PD.IsLastPage;  
  63.         Button3.Enabled = !PD.IsLastPage;  
  64.         ViewState["TotalCount"] = PD.PageCount;  
  65.         EmpDataList.DataSource = PD;  
  66.         EmpDataList.DataBind();  
  67.         ViewState["PagedDataSurce"] = dt;  
  68.     }  
  69.     protected void Button1_Click(object sender, EventArgs e)  
  70.     {  
  71.         CurrentPage = 0;  
  72.         EmpDataList.DataSource = (DataTable)ViewState["PagedDataSurce"];  
  73.         EmpDataList.DataBind();  
  74.          
  75.     }  
  76.     protected void Button2_Click(object sender, EventArgs e)  
  77.     {  
  78.         CurrentPage = (int)ViewState["PageCount"];  
  79.         CurrentPage -= 1;  
  80.         ViewState["PageCount"] = CurrentPage;  
  81.        
  82.         DataListPaging((DataTable)ViewState["PagedDataSurce"]);  
  83.          
  84.     }  
  85.     protected void Button3_Click(object sender, EventArgs e)  
  86.     {  
  87.         CurrentPage = (int)ViewState["PageCount"];  
  88.         CurrentPage += 1;  
  89.         ViewState["PageCount"] = CurrentPage;  
  90.         DataListPaging((DataTable)ViewState["PagedDataSurce"]);  
  91.     }  
  92.     protected void Button4_Click(object sender, EventArgs e)  
  93.     {  
  94.         CurrentPage = (int)ViewState["TotalCount"] - 1;  
  95.         DataListPaging((DataTable)ViewState["PagedDataSurce"]);  
  96.     }  
  97. } 
 Now run the application. The UI will look as follows:
 
 
 
Now in the preceding you see that the first and previous buttons are disabled because the page is loaded the first time. Now click on the Next button and it will show you the next records as in the following:
 
 
 
Now click on the Previous button. It will show you Previous records as in the following:
 
 
 
Now click on the Last button. It will show you the last records as in the following:
 
 
 
Now you have seen how to do paging in a DataList.
 
Notes
  • For detailed code please download the sample Zip file.
  • Do a proper validation such as date input values when implementing.
  • Make the changes in the web.config file depending on your server details for the connection string.
Summary
 
From all the preceding examples you have learned how to do paging in a DataList. I hope this article is useful for all readers, if you have a suggestion then please contact me.


Similar Articles