Custom paging in Repeater control in asp.net(C#, VB)

custom paging in repeater in asp.net
Click on Image to enlarge
Introduction: In previous articles i explained How to bind Repeater data control and How to bind, edit, update and delete data in Repeater. and Bind,Save,Edit,Update,Cancel,Delete,Paging example in GridView in asp.net C# and  How to Bind and implement Custom paging in asp.net DataList control in 3 different ways and  Delete multiple selected records based on CheckBox in GridView and  How to upload, download and delete files from GridView in Asp.net?
Now i am going to explain with example How to implement custom paging for repeater data control.

Description: Whenever large amount of data need to be displayed in Repeater control then we need of paging to break data in pieces. But as we all know there is no in built paging in Repeater control. But we can take the advantage of custom paging through which we can achieve same paging results as for other control like GridView. As it is custom paging we can also make it look different. Let’s take an example.

Implementation: Let's create an asp.net application to better understand the paging in repeater data control
  • First of all Create database in Sql e.g. "MyDataBase" and in this create a table and name it "Book_Details"as:

paging in repeater as.net

  • Now in the web.config file create the connection string to connect the asp.net application with the sql server database as.
<connectionStrings>
                                <add name="conStr" connectionString="Data Source=LocalServer;Initial Catalog=MyDataBase;Integrated Security=True"/>
                </connectionStrings>

Note: Replace the Data Source and Initial Catalog(i.e. Database name) as per your application.
  • Now in the design page(.aspx) place two repeater controls, one for binding Book details and another for Paging as:
Source Code:

 <fieldset style="width:310px">
    <legend>Custom paging in Repeater</legend>
    <asp:Repeater ID="rptBooks" runat="server">
     <HeaderTemplate>  
        <table style=" border:1px solid #c1650f; width:300px" cellpadding="0">
<tr style="background-color:#ffa100; color:White">
<td colspan="2">
<b><center>Book Details</center></b>
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color:#ffa100">
<td>
<table style="background-color:#f7f7f7;border-top:1px dotted #c1650f; width:300px" >
<tr>
<td>
<b>Book Name:</b>
<asp:Label ID="lblBookName" runat="server" Text='<%#Eval("Book_Name") %>'/>
</td>
</tr>
<tr>
<td>
<b>Author:</b>
<asp:Label ID="lblAuthor" runat="server" Text='<%#Eval("Author") %>'/>
</td>
</tr>
<tr>
<td>
<b>Publisher:</b>
<asp:Label ID="lblPublisher" runat="server" Text='<%#Eval("Publisher") %>'/>
</td>
</tr>
<tr>
<td>
<b>Price:</b>
<asp:Label ID="lblPrice" runat="server" Text='<%#Eval("Price") %>'/>
</td>
</tr>
</table>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
    </asp:Repeater>
                    <div style="overflow: hidden;">
        <asp:Repeater ID="rptPaging" runat="server" onitemcommand="rptPaging_ItemCommand">
            <ItemTemplate>
                                <asp:LinkButton ID="btnPage"
                 style="padding:8px; margin:2px; background:#ffa100; border:solid 1px #666; font:8pt tahoma;"
                CommandName="Page" CommandArgument="<%# Container.DataItem %>"
                 runat="server" ForeColor="White" Font-Bold="True"><%# Container.DataItem %>
                                </asp:LinkButton>
           </ItemTemplate>
        </asp:Repeater>
        </div>
       </fieldset>

C#.Net Code to implement custom paging in repeater data control
  • In the code behind file(.aspx.cs) write the code as:
First of all include the required namespaces and then write the code:

using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.Collections;

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            BindRepeater();
        }
    }
    protected void BindRepeater()
    {
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["conStr"].ConnectionString.ToString());
        SqlCommand cmd = new SqlCommand("Select * from Book_Details", con);
        if (con.State == ConnectionState.Closed)
        {
            con.Open();
        }
        DataTable dt = new DataTable();
        SqlDataAdapter adp = new SqlDataAdapter(cmd);
        adp.Fill(dt);
        PagedDataSource pgitems = new PagedDataSource();
        DataView dv = new DataView(dt);
        pgitems.DataSource = dv;
        pgitems.AllowPaging = true;
        pgitems.PageSize = 2;
        pgitems.CurrentPageIndex = PageNumber;
        if (pgitems.PageCount > 1)
        {
            rptPaging.Visible = true;
            ArrayList pages = new ArrayList();
            for (int i = 0; i < pgitems.PageCount; i++)
                pages.Add((i + 1).ToString());
            rptPaging.DataSource = pages;
            rptPaging.DataBind();
        }
        else
        {
            rptPaging.Visible = false;
        }
            rptBooks.DataSource = pgitems;
            rptBooks.DataBind();   
    }
    public int PageNumber
    {
        get
        {
            if (ViewState["PageNumber"] != null)
                return Convert.ToInt32(ViewState["PageNumber"]);
            else
                return 0;
        }
        set
        {
            ViewState["PageNumber"] = value;
        }
     }
    protected void rptPaging_ItemCommand(object source, RepeaterCommandEventArgs e)
    {
        PageNumber = Convert.ToInt32(e.CommandArgument) - 1;
        BindRepeater();
    }

VB.NET Code to implement custom paging in repeater data control

  • In the design page place two repeater controls, one for binding Book details and another for Paging as:
Source Code:

 <fieldset style="width:310px">
    <legend>Custom paging in Repeater</legend>
    <asp:Repeater ID="rptBooks" runat="server">
     <HeaderTemplate>
           <table style=" border:1px solid #c1650f; width:300px" cellpadding="0">
<tr style="background-color:#ffa100; color:White">
<td colspan="2">
<b><center>Book Details</center></b>
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color:#ffa100">
<td>
<table style="background-color:#f7f7f7;border-top:1px dotted #c1650f; width:300px" >
<tr>
<td>
<b>Book Name:</b>
<asp:Label ID="lblBookName" runat="server" Text='<%#Eval("Book_Name") %>'/>
</td>
</tr>
<tr>
<td>
<b>Author:</b>
<asp:Label ID="lblAuthor" runat="server" Text='<%#Eval("Author") %>'/>
</td>
</tr>
<tr>
<td>
<b>Publisher:</b>
<asp:Label ID="lblPublisher" runat="server" Text='<%#Eval("Publisher") %>'/>
</td>
</tr>
<tr>
<td>
<b>Price:</b>
<asp:Label ID="lblPrice" runat="server" Text='<%#Eval("Price") %>'/>
</td>
</tr>
</table>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
    </asp:Repeater>
                    <div style="overflow: hidden;">
        <asp:Repeater ID="rptPaging" runat="server">
            <ItemTemplate>
                                <asp:LinkButton ID="btnPage"
                 style="padding:8px; margin:2px; background:#ffa100; border:solid 1px #666; font:8pt tahoma;"
                CommandName="Page" CommandArgument="<%# Container.DataItem %>"
                 runat="server" ForeColor="White" Font-Bold="True"><%# Container.DataItem %>
                                </asp:LinkButton>
           </ItemTemplate>
        </asp:Repeater>
        </div>   
    </fieldset>
  • In the code behind file(.aspx.vb) write the code as:
Import the following required namespaces:

Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
Imports System.Collections

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not Page.IsPostBack Then
            BindRepeater()
        End If
    End Sub
    Protected Sub BindRepeater()
        Dim con As New SqlConnection(ConfigurationManager.ConnectionStrings("conStr").ConnectionString.ToString())
        Dim cmd As New SqlCommand("Select * from Book_Details", con)
        If con.State = ConnectionState.Closed Then
            con.Open()
        End If
        Dim dt As New DataTable()
        Dim adp As New SqlDataAdapter(cmd)
        adp.Fill(dt)
        Dim pgitems As New PagedDataSource()
        Dim dv As New DataView(dt)
        pgitems.DataSource = dv
        pgitems.AllowPaging = True
        pgitems.PageSize = 2
        pgitems.CurrentPageIndex = PageNumber
        If pgitems.PageCount > 1 Then
            rptPaging.Visible = True
            Dim pages As New ArrayList()
            For i As Integer = 0 To pgitems.PageCount - 1
                pages.Add((i + 1).ToString())
            Next
            rptPaging.DataSource = pages
            rptPaging.DataBind()
        Else
            rptPaging.Visible = False
        End If
        rptBooks.DataSource = pgitems
        rptBooks.DataBind()
    End Sub
    Public Property PageNumber() As Integer
        Get
            If ViewState("PageNumber") IsNot Nothing Then
                Return Convert.ToInt32(ViewState("PageNumber"))
            Else
                Return 0
            End If
        End Get
        Set(ByVal value As Integer)
            ViewState("PageNumber") = value
        End Set
    End Property
    Protected Sub rptPaging_ItemCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.RepeaterCommandEventArgs) Handles rptPaging.ItemCommand
        PageNumber = Convert.ToInt32(e.CommandArgument) - 1
        BindRepeater()
    End Sub

Now over to you:
"If you like my work; you can appreciate by leaving your comments, hitting Facebook like button, following on Google+, Twitter, Linked in and Pinterest, stumbling my posts on stumble upon and subscribing for receiving free updates directly to your inbox . Stay tuned for more technical updates."
Previous
Next Post »

13 comments

Click here for comments
Anonymous
admin
August 21, 2013 ×

Thanks.. Its really helped me alot

Regards,
Rajesh

Reply
avatar
August 21, 2013 ×

it is always nice to hear that my post helped anyone..thanks rajesh..stay tuned and stay connected for more useful updates like this.

Reply
avatar
Anonymous
admin
October 07, 2013 ×

hello! How can i set the enabled and disabled pagination number. E.g. i'm in page 2, i want to highlight page number 2. It should highlight the selected page. Please help thanks!

Reply
avatar
November 28, 2013 ×

Thanks Its Very Useful

Reply
avatar
November 28, 2013 ×

Your welcome..keep reading for more useful updates like this..:)

Reply
avatar
Unknown
admin
December 02, 2013 ×

Sir Can you please help me in repeater.I have checkboxes in repeater cntrol and I want to display selected checkbox values on grid.I have Show Data button.When I press this button it should show selected records on grid.My repeater is using paging and I want to maintain checkbox states on different pages of repeater.

Reply
avatar
Anonymous
admin
August 02, 2014 ×

sdasdasdadasd

Reply
avatar
August 07, 2014 ×

Your welcome Chandra Sekar..:)

Reply
avatar
Sameh Saeed
admin
January 14, 2016 ×

Thanks bro. Your solution working very well :)

Reply
avatar
February 08, 2016 ×

Thanks for you feedback..I am glad you liked my article..stay connected and keep reading...

Reply
avatar
Satya
admin
July 04, 2016 ×

Thanks a lot !!! Its working fine

Reply
avatar
August 18, 2016 ×

Thanks for you feedback..I am glad you liked this article..stay connected and keep reading...

Reply
avatar

If you have any question about any post, Feel free to ask.You can simply drop a comment below post or contact via Contact Us form. Your feedback and suggestions will be highly appreciated. Also try to leave comments from your account not from the anonymous account so that i can respond to you easily..