Paging With DataList Control in ASP.NET

A K
13y
128.9k
0
0

Article

Introduction

AllowPaging is an important property in web applications to enable paging. Suppose we want to show a limited number of records from a database using a DetailsView or GridView, then we simply enable its AllowPaging property to True and easily add paging facility. But when we want to add a paging feature to a DataList or Repeater control, then there is not an AllowPaging property. We used PagedDataSource to add a paging feature in DataList or Repeater controls. Here I am displaying records from a database in a DalaList control and adding a paging feature in a DataList.

In this example, the database name is "student" and the database table name is "student_detail". I am giving a screenshot of all records to it easier to understand.

i

Now take a web application -> take a DataList and four Button controls like in the following figure.

Write the following code.

Code on .aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="PagininDataList.WebForm1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .style1
        {
            width: 672px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
   <div>
    <table style="height: 79px; width: 429px">
        <asp:DataList ID="DataList1" runat="server">
        <HeaderTemplate>
        <h1> Details </h1>
        </HeaderTemplate>
      <ItemTemplate>
        <tr>
        <td><h4>Roll Number</h4> </td>
         <td><h4>NAME</h4></td>
          <td><h4>AGE</h4></td>
           <td><h4>CITY</h4></td>
           <td><h4>COURSE</h4></td>
        </tr>
        <tr>
        <td><h5><%#Eval("roll_no") %></h5></td>
         <td><h5><%#Eval("s_name") %></h5></td>
          <td><h5><%#Eval("age") %></h5></td>
           <td><h5><%#Eval("city") %></h5></td>
            <td><h5><%#Eval("course") %></h5></td>
        </tr>
        </ItemTemplate>
        </asp:DataList>
       </table>
   <table>
<tr>
    <td>
        <asp:Button ID="btnfirst" runat="server" Font-Bold="true" Text="<<" Height="31px"
                    Width="43px" onclick="btnfirst_Click" /></td>
        <td>
            <asp:Button ID="btnprevious" runat="server" Font-Bold="true" Text="<" Height="31px"
                    Width="43px" onclick="btnprevious_Click" /></td>
            <td>
                <asp:Button ID="btnnext" runat="server" Font-Bold="true" Text=">" Height="31px"
                    Width="43px" onclick="btnnext_Click" /></td>
                <td>
                    <asp:Button ID="btnlast" runat="server" Font-Bold="true" Text=">>" Height="31px"
                    Width="43px" onclick="btnlast_Click" /></td>
    </tr>
   </table>
    </div>
    </form>
</body>
</html>

Code on .aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Data;
namespace PagininDataList
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        SqlDataAdapter dadapter;
        DataSet dset;
        PagedDataSource adsource;
        string connstring = "database=student;server=.;user=sa;password=wintellect";
        int pos;
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                this.ViewState["vs"] = 0;
            }
            pos = (int)this.ViewState["vs"];
            databind();
        }
        public void databind()
        {
            dadapter = new SqlDataAdapter("select * from student_detail", connstring);
            dset = new DataSet();
            adsource = new PagedDataSource();
            dadapter.Fill(dset);
            adsource.DataSource = dset.Tables[0].DefaultView;
            adsource.PageSize = 3;
            adsource.AllowPaging=true;
            adsource.CurrentPageIndex = pos;
            btnfirst.Enabled = !adsource.IsFirstPage;
            btnprevious.Enabled = !adsource.IsFirstPage;
            btnlast.Enabled = !adsource.IsLastPage;
            btnnext.Enabled = !adsource.IsLastPage;
            DataList1.DataSource = adsource;
            DataList1.DataBind();
        }

        protected void btnfirst_Click(object sender, EventArgs e)
        {
            pos = 0;
            databind();
        }

        protected void btnprevious_Click(object sender, EventArgs e)
        {
            pos = (int)this.ViewState["vs"];
            pos -= 1;
            this.ViewState["vs"] = pos;
            databind();
        }

        protected void btnnext_Click(object sender, EventArgs e)
        {
            pos = (int)this.ViewState["vs"];
            pos += 1;
            this.ViewState["vs"] = pos;
            databind();
        }

        protected void btnlast_Click(object sender, EventArgs e)
        {
            pos = adsource.PageCount-1;
            databind();
        }
    }
}

Run the application.

Output

It will show 3 records at a time. You can go to the First, Previous, Next and Last record by clicking the appropriate button.

Here are some related resources

Up Next

Ebook Download

View all

Hands on ASP.NET GridView

Read by 12k people

Download Now!

Learn

View all

Paging With DataList Control in ASP.NET

Creating Custom Paging for Datalist control

Implementing Search in a DataList Web Forms Control

Web Paging Navigation Control