Click here to Skip to main content
15,889,877 members
Articles / Web Development / ASP.NET
Tip/Trick

Custom paging like Google paging

Rate me:
Please Sign up or sign in to vote.
5.00/5 (1 vote)
7 May 2012CPOL 16.9K   10   5
Custom paging with only 10 pages shown in pager.

Introduction

I found lot of articles in which custom paging is given but i have a requirement that in which when user click on a page number then only 10 page numbers should show like paging shown in Google search page.

SQL
create PROCEDURE [dbo].[GetCustomersPageWise]
(
  @PageIndex INT = 1, 
  @PageSize INT = 10 , 
  @RecordCount INT OUTPUT
) 
AS 
BEGIN 
  SET NOCOUNT ON; 
  SELECT ROW_NUMBER() OVER
  ( ORDER BY [cust_ID] ASC ) 
  AS RowNumber 
  ,[cust_ID]
  ,[cust_Name]
 INTO #Results
  FROM [customer_details]
 
  SELECT @RecordCount = COUNT(*)
  FROM #Results
        
  SELECT * FROM #Results
  WHERE RowNumber BETWEEN(@PageIndex -1) * @PageSize + 
        1 AND(((@PageIndex -1) * @PageSize + 1) + @PageSize) - 1
 
  DROP TABLE #Results
END

.aspx page

XML
<body style="overflow:hidden;" onload="javascript:full();">
    <form id="form1" runat="server">
   <div>
PageSize:
<asp:DropDownList ID="ddlPageSize" runat="server" AutoPostBack="true" 
                   OnSelectedIndexChanged="PageSize_Changed">
    <asp:ListItem Text="2" Value="2" />
    <asp:ListItem Text="5" Value="5" />
    <asp:ListItem Text="7" Value="7" />
</asp:DropDownList>
<hr />
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
           CellPadding="4" ForeColor="#333333" GridLines="None">
    <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
    <Columns>
        <asp:BoundField HeaderText="CustomerId" DataField="cust_ID" />
        <asp:BoundField HeaderText="CustomerName" DataField="cust_Name" />
    </Columns>
    <EditRowStyle BackColor="#999999" />
    <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
    <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
    <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
    <SortedAscendingCellStyle BackColor="#E9E7E2" />
    <SortedAscendingHeaderStyle BackColor="#506C8C" />
    <SortedDescendingCellStyle BackColor="#FFFDF8" />
    <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
</asp:GridView>
<br />
<asp:Repeater ID="rptPager" runat="server">
<ItemTemplate>
    <asp:LinkButton ID="lnkPage" runat="server" Text = '<%#Eval("Text") %>' 
       CommandArgument = '<%# Eval("Value") %>' 
       Enabled = '<%# Eval("Enabled") %>' 
       OnClick = "Page_Changed"></asp:LinkButton>
</ItemTemplate>
</asp:Repeater>
</div>

</form>
</body>

.aspx.cs page

C#
using System.Data.SqlClient;
using System.Configuration;
using System.Data;

public partial class sample2 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            GetCustomersPageWise(1);
        }
    }
    private void GetCustomersPageWise(int pageIndex)
    {
        string constring = ConfigurationManager.ConnectionStrings["cn"].ConnectionString;
        using (SqlConnection con = new SqlConnection(constring))
        {
            using (SqlCommand cmd = new SqlCommand("GetCustomersPageWise", con))
            {
                cmd.CommandType = CommandType.StoredProcedure;
                cmd.Parameters.AddWithValue("@PageIndex", pageIndex);
                cmd.Parameters.AddWithValue("@PageSize", int.Parse(ddlPageSize.SelectedValue));
                cmd.Parameters.Add("@RecordCount", SqlDbType.Int, 4);
                cmd.Parameters["@RecordCount"].Direction = ParameterDirection.Output;
                con.Open();
                IDataReader idr = cmd.ExecuteReader();
                GridView1.DataSource = idr;
                GridView1.DataBind();
                idr.Close();
                con.Close();
                int recordCount = Convert.ToInt32(cmd.Parameters["@RecordCount"].Value);
                this.PopulatePager(recordCount, pageIndex);
            }
        }
    } 
      private void PopulatePager(int recordCount, int currentPage)
    {
        double dblPageCount = (double)((decimal)recordCount / decimal.Parse(ddlPageSize.SelectedValue));
        int pageCount = (int)Math.Ceiling(dblPageCount);
        List<ListItem> pages = new List<ListItem>();
        if (pageCount > 0)
        {
            pages.Add(new ListItem("First", "1", currentPage > 1));
            if (currentPage == 1 && pageCount <= 10)
            {
                for (int i = 1; i <= pageCount; i++)
                {
                    pages.Add(new ListItem(i.ToString(), i.ToString(), i != currentPage));
                }
            }
            else if (currentPage == 1 && pageCount > 10)
            {
                for (int i = 1; i <= 10; i++)
                {
                    pages.Add(new ListItem(i.ToString(), i.ToString(), i != currentPage));
                }
            }
            else if (currentPage != 1 && pageCount <= 10)
            {
                for (int i = 1; i <= pageCount; i++)
                {
                    pages.Add(new ListItem(i.ToString(), i.ToString(), i != currentPage));
                }
            }
            else if (currentPage != 1 && pageCount > 10 && currentPage != pageCount)
            {
                int z = currentPage - 5;
                int x, y;
                if (z < 1)
                {
                    z = 1;
                    for (int i = z; i <= 10; i++)
                    {
                        pages.Add(new ListItem(i.ToString(), i.ToString(), i != currentPage));
                    }
                }
                else if (z >= 1)
                {
                    if (pageCount < currentPage + 4)
                    {
                        y = (z - ((currentPage + 4) - pageCount));
                        x = pageCount;
                    }
                    else
                    {
                        x = currentPage + 4;
                        y = z;
                    }
                    for (int i = y; i <= x; i++)
                    {
                       pages.Add(new ListItem(i.ToString(), i.ToString(), i != currentPage));
                    }
                }
            }
            else if (currentPage == pageCount)
            {
                for (int i = pageCount-9; i <= pageCount; i++)
                {
                    pages.Add(new ListItem(i.ToString(), i.ToString(), i != currentPage));
                }
            }
            pages.Add(new ListItem("Last", pageCount.ToString(), currentPage < pageCount));
        }
        rptPager.DataSource = pages;
        rptPager.DataBind();
    } 
    protected void PageSize_Changed(object sender, EventArgs e)
    {
        this.GetCustomersPageWise(1);
    }
    protected void Page_Changed(object sender, EventArgs e)
    {
        int pageIndex = int.Parse((sender as LinkButton).CommandArgument);
        this.GetCustomersPageWise(pageIndex);
    }
}

License

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


Written By
Software Developer
India India
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
QuestionIs it possible to have gridView default Pagination with this approach ? Pin
nishant00910-Oct-16 5:36
nishant00910-Oct-16 5:36 
Praisevery good, liked it Pin
Sabyasachi7327-Aug-16 2:36
Sabyasachi7327-Aug-16 2:36 
QuestionMy vote of 5 Pin
Member 817875219-Jul-15 20:04
Member 817875219-Jul-15 20:04 
Questionthanks alot Pin
Member 105061798-Nov-14 8:51
Member 105061798-Nov-14 8:51 
GeneralMy vote of 5 Pin
Prasad_Kulkarni13-Jun-12 2:19
Prasad_Kulkarni13-Jun-12 2:19 

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.