Click here to Skip to main content
15,867,945 members
Articles / Web Development / ASP.NET
Article

Pagination with Repeater Control

Rate me:
Please Sign up or sign in to vote.
4.08/5 (8 votes)
16 Dec 2008CPOL2 min read 119.7K   1.9K   35   11
Pagination with Repeater control / custome pagination with data control in C# ASP.NET 2.0

Introduction

Binding a repeater control is a simple task but to do pagination on a repeater control or custom paginantion on any data control is a little bit tough. This article demonstrates how to do custom pagination for any data control, or pagination with a repeater control and also how to bind a repeater control.

ASP.NET 2.0 provides five types of data controls among which the Repeater control is the fast bound data control. Nevertheless, there is no built-in pagination with this control. This means, binding numbers of records without pagination is not a good programing concept, since it will display entire data on a sigle page and the size of the page will become too long. So the solution is, custom pagination, if no in-built pagination is provided.

Mechanism

For custom pagination, I have used Data Logic (DL) support & converted the table dynamically as per convenience in the DL section, so that our application will run fast. The Stored Procedure “sp_StudentRec” takes two input parameters viz. @pag à user in the current page and @pgSize à the number of items you want to display. It returns two tables: The 1st one contains items and the 2nd one is for the total number of records present in the table. From this table we can calculate the number of possible pages at UI.

SQL
CREATE PROCEDURE sp_StudentRec  
( 
@pg int, 
@pgSize int 
) 
AS 
BEGIN 
Create table #temp 
( 
id int identity primary key, 
StName varchar(50), 
StRoll varchar(5), 
StPercent real 
) 
 
 
Set NoCount OFF 
Insert into #temp(StName, StRoll, StPercent) Select * from Tbl_Student order by AggMarks 
 
 
declare @from int 
declare @to int 
set @to=@pg * @pgSize 
Set @from= @pg * @pgSize-@pgsize 
 
Select * from #temp where id>@from and id<=@to 
Select count(*) from #temp
drop table #temp 
Set NoCount ON 
END
image001.jpg
Fig. 1 Structure of table

Fig. 1 shows the structure of the table. Make sure that your database contains the table used in SP with similar fields, or you can modify as per your need. Let us move towards the UI section now.

To display the items on the repeater control, bind the control using the DataBinder.Eval() method as shown below within <ItemTemplate> of the control.

ASP.NET
<asp:Repeater ID="Repeater1" runat="server">
  <ItemTemplate>
    <table>
      <tr>
        <td style="width:70px"><%#DataBinder.Eval(Container.DataItem, "StRoll") %></td>
        <td style="width:150px"><%#DataBinder.Eval(Container.DataItem, "StName") %></td>
        <td style="width:30px"><%#DataBinder.Eval(Container.DataItem, "StPercent") %></td>
      </tr>
    </table>
  </ItemTemplate>
</asp:Repeater>
 
<asp:LinkButton ID="lnkBtnPrev" runat="server" Font-Underline="False"
            OnClick="lnkBtnPrev_Click" Font-Bold="True"><< Prev </asp:LinkButton>
            <input id="txtHidden" style="width: 28px" type="hidden" value="1"
                runat="server" />
            <asp:LinkButton ID="lnkBtnNext" runat="server" Font-Underline="False"
                OnClick="lnkBtnNext_Click" Font-Bold="True">Next >></asp:LinkButton>

To do custome pagination, take two link button controls, one for <<Prevous, and another for Next>>. Apart from this, take a hidden field to maintain the page status (i.e the page on which the user is currently). On the <<Previous link click event, decrease the value in the hidden field by 1. Similarly, increase the hidden field value by 1 on the Next>> link button click event and bind the repeater. Hence, you can navigate either side and items will be displayed accordingly. The code is:

C#
protected void lnkBtnPrev_Click(object sender, EventArgs e)
    {
        txtHidden.Value = Convert.ToString(Convert.ToInt16(txtHidden.Value) - 1);
        bindrepeater();
    }
 
protected void lnkBtnNext_Click(object sender, EventArgs e)
    {
        txtHidden.Value = Convert.ToString(Convert.ToInt16(txtHidden.Value) + 1);
        bindrepeater();
    }
 
// On page load event..
protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            bindrepeater();
        }
    }

// Bind repeater control..
public void bindrepeater()
    {
        SqlConnection con = new SqlConnection("Your Conection String");
        SqlCommand com = new SqlCommand("sp_StudentRec", con);
        com.CommandType = CommandType.StoredProcedure;
        com.Parameters.Add("@pg", SqlDbType.Int).Value = Convert.ToInt16(txtHidden.Value);
        com.Parameters.Add("@pgSize", SqlDbType.Int).Value = 5;
 
        SqlDataAdapter da = new SqlDataAdapter();
        da.SelectCommand = com;
 
        DataSet ds = new DataSet();
        da.Fill(ds);
        Repeater1.DataSource = ds;
        Repeater1.DataBind();
        pageno(Convert.ToInt16(ds.Tables[1].Rows[0][0].ToString()));
    }

Simultaneously, you need to maintain the link button’s visibility according to items present on the control, so that it will work properly. For this, the function is given below. The Fig. 2 shows three different results.

C#
public void pageno(int totItems)
    {
        // Calculate total numbers of pages
        int pgCount = totItems / 5 + totItems % 5;
 
        // Display Next>> button
        if (pgCount-1 > Convert.ToInt16(txtHidden.Value))
            lnkBtnNext.Visible = true;
        else
            lnkBtnNext.Visible = false;
 
        // Display <<Prev button
        if ((Convert.ToInt16(txtHidden.Value)) > 1)
            lnkBtnPrev.Visible = true;
        else
            lnkBtnPrev.Visible = false;
    }

Output

image002.jpg

image003.jpg

image004.jpg

Fig. 2 Output

Once you have understand the concept, you can modify it according to your requirements. I hope this article will help you to do your custom pagination for any type of data control, whether the built-in paging property is provided or not.

Wish you all the best and happy coding.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior)
India India
Save paper, save tree. Stop global warming.
http://www.navinpandit.blogspot.in/p/global-warming.html

Comments and Discussions

 
QuestionNeed to find a way to call the pageno fun with same value using var for sql query Pin
Member 1130418621-Jul-15 10:14
Member 1130418621-Jul-15 10:14 
AnswerRe: Need to find a way to call the pageno fun with same value using var for sql query Pin
Navin Pandit23-Jul-15 23:00
Navin Pandit23-Jul-15 23:00 
GeneralMy vote of 1 Pin
Member 869397212-Nov-13 21:33
Member 869397212-Nov-13 21:33 
BugStored Procedure Pin
riodejenris1412-Sep-13 0:49
riodejenris1412-Sep-13 0:49 
GeneralRe: Stored Procedure Pin
riodejenris1413-Sep-13 0:13
riodejenris1413-Sep-13 0:13 
GeneralRe: Stored Procedure Pin
Navin Pandit13-Sep-13 0:47
Navin Pandit13-Sep-13 0:47 
QuestionPagination Problem With Reapeater Pin
paracha120-Feb-13 8:05
paracha120-Feb-13 8:05 
AnswerRe: Pagination Problem With Reapeater Pin
Navin Pandit13-Sep-13 0:40
Navin Pandit13-Sep-13 0:40 
Generalthanks but.. Pin
ukWaqas1-Jun-09 23:17
ukWaqas1-Jun-09 23:17 
GeneralRe: thanks but.. Pin
Navin Pandit8-Jul-09 20:37
Navin Pandit8-Jul-09 20:37 
GeneralRe: thanks but.. Pin
ukWaqas27-Sep-09 9:24
ukWaqas27-Sep-09 9:24 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.