Hello, Welcome to my blog. If you like feel free to refer others

Thursday, 2 February 2012

Custom Paging in ASP.Net GridView using SQL Server Stored Procedure

In this article I’ll explain how to implement Custom Paging in ASP.Net GridView control. 
Why Custom Pagination?
The answer is that ASP.Net GridView fetches all the records and then displays one page from the fetched records. Thus for example if your table has 1000 records and you need to display only 50 records per page, GridView will fetch all 1000 records discard the 950 records and display the 50 records based on the page index selected by the users.
Thus the above approach is quite inefficient in terms of both bandwidth and performance. With custom pagination we will fetch records per page based on the page index. Thus if our table has 1000 records and we need to display only 50 records per page, then we will fetch only 50 records based on page index. Thus this will boost the performance of the application.
Pagination Stored Procedure
SQL Server 2005 came up with the new ROW_NUMBER() keyword that allows us to give row numbers to the records that we select from the table. Using this row number we can implement our custom pagination logic within the SQL Server Stored Procedure.
I am using the Customers table Microsoft’s NorthWind Database for this article and below is the Stored Procedure that allows us to fetch records page wise.
Here is store procedure I have used.
      @PageIndex INT = 1
      ,@PageSize INT = 10
      ,@RecordCount INT OUTPUT
            ORDER BY [CustomerID] ASC
      )AS RowNumber
     INTO #Results
      FROM [Customers]
      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
Markup HTML :
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CustomPagingUsingSQL.aspx.cs"
    Inherits="ExcelApplication.CustomPagingUsingSQL" %>

<!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">
    <form id="form1" runat="server">
        <asp:DropDownList ID="ddlPageSize" runat="server" AutoPostBack="true" OnSelectedIndexChanged="PageSize_Changed">           
            <asp:ListItem Text="10" Value="10" />
            <asp:ListItem Text="25" Value="25" />
            <asp:ListItem Text="50" Value="50" />
        <hr />
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
                <asp:BoundField HeaderText="CustomerId" DataField="CustomerId" />
                <asp:BoundField HeaderText="ContactName" DataField="ContactName" />
                <asp:BoundField HeaderText="CompanyName" DataField="CompanyName" />
        <br />
        <asp:Repeater ID="rptPager" runat="server">
                <asp:LinkButton ID="lnkPage" runat="server" Text='<%#Eval("Text") %>' CommandArgument='<%# Eval("Value") %>'
                    Enabled='<%# Eval("Enabled") %>' OnClick="Page_Changed"></asp:LinkButton>
Code Behind:
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.Configuration;
using System.Data;

namespace ExcelApplication
    public partial class CustomPagingUsingSQL : System.Web.UI.Page
        protected void Page_Load(object sender, EventArgs e)
            if (!Page.IsPostBack)
                GetCustomersPageWise(1);//Here 1 is the default value
        private void GetCustomersPageWise(int pageIndex)
            string constring = ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].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;
                    IDataReader idr = cmd.ExecuteReader();
                    GridView1.DataSource = idr;
                    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));
                for (int i = 1; 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;

        protected void PageSize_Changed(object sender, EventArgs e)

        protected void Page_Changed(object sender, EventArgs e)
            int pageIndex = int.Parse((sender as LinkButton).CommandArgument);
Designer File :
// <auto-generated>
//     This code was generated by a tool.
//     Changes to this file may cause incorrect behavior and will be lost if
//     the code is regenerated.
// </auto-generated>

namespace ExcelApplication {
    public partial class CustomPagingUsingSQL {
        /// <summary>
        /// form1 control.
        /// </summary>
        /// <remarks>
        /// Auto-generated field.
        /// To modify move field declaration from designer file to code-behind file.
        /// </remarks>
        protected global::System.Web.UI.HtmlControls.HtmlForm form1;
        /// <summary>
        /// ddlPageSize control.
        /// </summary>
        /// <remarks>
        /// Auto-generated field.
        /// To modify move field declaration from designer file to code-behind file.
        /// </remarks>
        protected global::System.Web.UI.WebControls.DropDownList ddlPageSize;
        /// <summary>
        /// GridView1 control.
        /// </summary>
        /// <remarks>
        /// Auto-generated field.
        /// To modify move field declaration from designer file to code-behind file.
        /// </remarks>
        protected global::System.Web.UI.WebControls.GridView GridView1;
        /// <summary>
        /// rptPager control.
        /// </summary>
        /// <remarks>
        /// Auto-generated field.
        /// To modify move field declaration from designer file to code-behind file.
        /// </remarks>
        protected global::System.Web.UI.WebControls.Repeater rptPager;
Happy Learning.......:)

1 comment: