1. Resources
    2. .NET programming
    3. ASP.NET/Web Applications

ASP.NET Custom paging

Posted Date: 20 Jan 2012 |Updated: 20-Jan-2012 |Category: ASP.NET/Web Applications |Author: |Member Level: Gold |Points: 10 |


Sometimes we may encounter the issue with a default paging for a ASP.NET grid view, because of load of the data from the data base. The performance of the ASP.NET grid view along with the page will be slow down and that will be irritate to our client. To overcome this issue, we should have to develop the Custom Paging for Grid View and to get the faster retrieval and improve the page performance when we are having the loads of data from the data base. About ASP.NET Custom paging

Learn ASP.NET Custom paging


Below sample demonstrate how to develop the custom paging step by step manner and better understandable.

Open the Microsoft Visual studio and create one web page. Now drag the grid view to ASP.NET page, define the CustomerID, CompanyName and ContactName in it. In the grid view pager template place the Place holder control.

ASP.NET Custom paging HTML Code:


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="CustomPaging._Default" %>
 
<!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>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="GridView1" runat="server" AllowPaging="True" OnPageIndexChanging="GridView1_PageIndexChanging"
        OnDataBound="GridView1_DataBound" AutoGenerateColumns="False" DataKeyNames="CustomerID">
        <Columns>
            <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" ReadOnly="True" SortExpression="CustomerID" />
            <asp:BoundField DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName" />
            <asp:BoundField DataField="ContactName" HeaderText="ContactName" SortExpression="ContactName" />
                   </Columns>
        <PagerTemplate>
            <table width="100%">
                <tr>
                    <td style="text-align: right">
                        <asp:PlaceHolder ID="PlaceHolder1" runat="server" />
                    </td>
                </tr>
            </table>
        </PagerTemplate>
    </asp:GridView>
 
    </div>
    </form>
</body>
</html>



Now bind the XML data(I am using XML for my convenience) to a grid view , by using the ReadXML property of a Dataset.


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Drawing;
 
namespace CustomPaging
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            DataSet XMLDataSet;
            string FilePath = Server.MapPath(@"~\MyXMLFile.xml");
            XMLDataSet = new DataSet();
 
            //Read the contents of the XML file into the DataSet
            XMLDataSet.ReadXml(FilePath);
            GridView1.DataSource = XMLDataSet.Tables[0].DefaultView;
            GridView1.DataBind();
 
        }
 
        protected void GridView1_DataBound(object sender, EventArgs e)
        {
            setCustomPaging();
        }
 
        protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
        {
            GridView1.PageIndex = e.NewPageIndex;  
 
        }
        private void setCustomPaging()
        {
            int alphaStart = 65;
            GridViewRow row = GridView1.BottomPagerRow;
            row.VerticalAlign = VerticalAlign.Middle;
            int pageCount=GridView1.PageCount;
 
            for (int loop = 1; loop < pageCount; loop++)
            {
                LinkButton lnkBtn = new LinkButton();
                lnkBtn.CommandName = "Page";
                lnkBtn.CommandArgument = loop.ToString();
 
                if (loop == GridView1.PageIndex + 1)
                {
                    lnkBtn.BackColor = Color.Red;
                }
 
                lnkBtn.Text = Convert.ToChar(alphaStart).ToString();
                lnkBtn.ToolTip = "Page " + loop.ToString();
                alphaStart++;
                PlaceHolder place = row.FindControl("PlaceHolder1") as PlaceHolder;
                place.Controls.Add(lnkBtn);
 
                Label myLbl = new Label();
                myLbl.Text = " ";
                place.Controls.Add(myLbl);
            }
        }
 
    }
}

XML page to bind the grid view.


<?xml version="1.0" encoding="utf-8"?>
<RequestData>
  <Dbval>
    <CustomerID>1</CustomerID>
    <CompanyName>naveen</CompanyName>
    <ContactName>Naveen Kumar Bokku</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>2</CustomerID>
    <CompanyName>naveen2</CompanyName>
    <ContactName>Naveen Kumar Bokku2</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>3</CustomerID>
    <CompanyName>naveen3</CompanyName>
    <ContactName>Naveen Kumar Bokku3</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>4</CustomerID>
    <CompanyName>naveen4</CompanyName>
    <ContactName>Naveen Kumar Bokku4</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>5</CustomerID>
    <CompanyName>naveen5</CompanyName>
    <ContactName>Naveen Kumar Bokku5</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>1</CustomerID>
    <CompanyName>naveen</CompanyName>
    <ContactName>Naveen Kumar Bokku</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>2</CustomerID>
    <CompanyName>naveen2</CompanyName>
    <ContactName>Naveen Kumar Bokku2</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>3</CustomerID>
    <CompanyName>naveen3</CompanyName>
    <ContactName>Naveen Kumar Bokku3</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>4</CustomerID>
    <CompanyName>naveen4</CompanyName>
    <ContactName>Naveen Kumar Bokku4</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>5</CustomerID>
    <CompanyName>naveen5</CompanyName>
    <ContactName>Naveen Kumar Bokku5</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>1</CustomerID>
    <CompanyName>naveen</CompanyName>
    <ContactName>Naveen Kumar Bokku</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>2</CustomerID>
    <CompanyName>naveen2</CompanyName>
    <ContactName>Naveen Kumar Bokku2</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>3</CustomerID>
    <CompanyName>naveen3</CompanyName>
    <ContactName>Naveen Kumar Bokku3</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>4</CustomerID>
    <CompanyName>naveen4</CompanyName>
    <ContactName>Naveen Kumar Bokku4</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>5</CustomerID>
    <CompanyName>naveen5</CompanyName>
    <ContactName>Naveen Kumar Bokku5</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>1</CustomerID>
    <CompanyName>naveen</CompanyName>
    <ContactName>Naveen Kumar Bokku</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>2</CustomerID>
    <CompanyName>naveen2</CompanyName>
    <ContactName>Naveen Kumar Bokku2</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>3</CustomerID>
    <CompanyName>naveen3</CompanyName>
    <ContactName>Naveen Kumar Bokku3</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>4</CustomerID>
    <CompanyName>naveen4</CompanyName>
    <ContactName>Naveen Kumar Bokku4</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>5</CustomerID>
    <CompanyName>naveen5</CompanyName>
    <ContactName>Naveen Kumar Bokku5</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>1</CustomerID>
    <CompanyName>naveen</CompanyName>
    <ContactName>Naveen Kumar Bokku</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>2</CustomerID>
    <CompanyName>naveen2</CompanyName>
    <ContactName>Naveen Kumar Bokku2</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>3</CustomerID>
    <CompanyName>naveen3</CompanyName>
    <ContactName>Naveen Kumar Bokku3</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>4</CustomerID>
    <CompanyName>naveen4</CompanyName>
    <ContactName>Naveen Kumar Bokku4</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>5</CustomerID>
    <CompanyName>naveen5</CompanyName>
    <ContactName>Naveen Kumar Bokku5</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>1</CustomerID>
    <CompanyName>naveen</CompanyName>
    <ContactName>Naveen Kumar Bokku</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>2</CustomerID>
    <CompanyName>naveen2</CompanyName>
    <ContactName>Naveen Kumar Bokku2</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>3</CustomerID>
    <CompanyName>naveen3</CompanyName>
    <ContactName>Naveen Kumar Bokku3</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>4</CustomerID>
    <CompanyName>naveen4</CompanyName>
    <ContactName>Naveen Kumar Bokku4</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>5</CustomerID>
    <CompanyName>naveen5</CompanyName>
    <ContactName>Naveen Kumar Bokku5</ContactName>
      </Dbval>
  <Dbval>
    <CustomerID>1</CustomerID>
    <CompanyName>naveen</CompanyName>
    <ContactName>Naveen Kumar Bokku</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>2</CustomerID>
    <CompanyName>naveen2</CompanyName>
    <ContactName>Naveen Kumar Bokku2</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>3</CustomerID>
    <CompanyName>naveen3</CompanyName>
    <ContactName>Naveen Kumar Bokku3</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>4</CustomerID>
    <CompanyName>naveen4</CompanyName>
    <ContactName>Naveen Kumar Bokku4</ContactName>
  </Dbval>
  <Dbval>
    <CustomerID>5</CustomerID>
    <CompanyName>naveen5</CompanyName>
    <ContactName>Naveen Kumar Bokku5</ContactName>
  </Dbval>
</RequestData>


Comments

No responses found. Be the first to comment...


  • Do not include your name, "with regards" etc in the comment. Write detailed comment, relevant to the topic.
  • No HTML formatting and links to other web sites are allowed.
  • This is a strictly moderated site. Absolutely no spam allowed.
    • Name:
    Email:
    Submit Article
    Return to Article Index

    Top Contributors

    Today
      Last 7 Days

      more...

      About dotnetspider.com

      We believe in providing quality content to our readers. If you have any questions or concerns regarding any content published here, feel free to contact us using the Contact link below.

      Quick Links
      General
      Services

      Digital Marketing by SpiderWorks Technologies, Kochi - India. ©