GridView / DataList Paging Control

Nitin Sindhu

Rate me:

4.88/5 (13 votes)

24 Sep 2008CPOL

90.2K

1.5K

Simple custom paging with an ASCX control, where the developer can easily edit the stylesheet.

Download sample project - 5.87 KB

Introduction

This is a custom paging control for data controls (GridView / DataList / Repeater). From this control, developers can easily add custom paging on a data control.

Using the code

It is very simple to add custom paging on a data control. Please add the DLL (App_Web_pagingcontrol.ascx.cdcab7d2.dll) in the bin directory and PagingControl.ascx in the root directory.

Here is the ASPX code:

ASP.NET

<%@ Page Language="C#" AutoEventWireup="true" 
    CodeFile="Default.aspx.cs" Inherits="GridView_Default" %>

<%@ Register Src="PagingControl.ascx" 
   TagName="PagingControl" TagPrefix="uc1" %>

<!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 id="Head1" runat="server">
    <title>Untitled Page</title>
        <style type="text/css">
          .paging-div
            {font-size: 9px; position:relative;
            text-align:left;color:rgb(128, 128, 128);margin-bottom:10px; 
            margin-top:10px; line-height:100%; font-family:Verdana;}
          .paging-div div
            {font-size: 9px; font-weight: normal; 
            display:inline;list-style:none;text-align:center; 
            margin:2px; font-family:Verdana;}
          .paging-div div span
            {font-size: 9px; font-weight: normal; 
            color: #CC0000; border: 1px #CC0000 solid; 
            padding: 3px 6px 3px 6px; font-family:Verdana;}
          .paging-div div a
            {font-size: 9px; font-weight: normal; 
            color: #000000; border: 1px #CDDCED solid; 
            padding: 3px 6px 3px 6px; 
            font-family:Verdana; text-decoration: none;}
          .paging-div div a:hover
            {font-size: 9px; font-weight: normal; 
            color: #FFFFFF; border: 1px #000000 solid; 
            padding: 3px 6px 3px 6px; font-family:Verdana;
            background-color: #5F8FC5; text-decoration: none;}
          .paging-div .nav
            {font-size: 9px; font-weight: normal; 
            color: #CCCCCC; border: 1px #CCCCCC solid; 
            padding: 3px 6px 3px 6px; font-family:Verdana;}
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <table cellpadding="0" cellspacing="0" 
                      width="100%" border="0">
                <tr>
                    <td>
                        <uc1:PagingControl ID="Paging1" 
                           OnPaging_Click="Paging_Click" 
                           FirstString="<< First" 
                           LastString=" Last >>" 
                           NextString="Next >" 
                           PrevString="< Prev" 
                           TotalNumberPaging="5"  
                           runat="server" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:GridView ID="grdTest" 
                            runat="server" 
                            AutoGenerateColumns="true" 
                            AllowPaging="true"
                            PageSize="5" 
                            PagerSettings-Visible="false">
                        </asp:GridView>
                    </td>
                </tr>
                <tr>
                    <td>
                    </td>
                </tr>
            </table>
        </div>
    </form>
</body>
</html>

Here is the code (.cs) file:

using System;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using Sindhu;
public partial class GridView_Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            DataLoad();
        }
    }

    public void DataLoad()
    {
        DataSet DS = new DataSet();
        DS=GetData();

        // in case  of datagrid / gridview
        Paging1.PageSize = grdTest.PageSize;
        Paging1.TotalRecord = DS.Tables[0].Rows.Count;
        Paging1.CurrentPage = grdTest.PageIndex + 1;
        Paging1.DataLoad();

        // in case of data list /  repeater
        /*
        DataSet DS1 = new DataSet();
        int TotalRecords = DS.Tables[0].Rows.Count;
        int PageSize = 1;

        int StartIndex = 0;
        int EndIndex = 0;
        StartIndex = 
          Convert.ToInt32(Convert.ToInt32(PageIndex)) * PageSize;
        EndIndex = StartIndex + PageSize;
        int inti = 0;

        for (inti = StartIndex; inti < EndIndex 
             && inti < DS.Tables[0].Rows.Count; inti++)
        {
            if (inti == StartIndex)
            {
                DS1.Tables.Add();
                for (int i = 0; i < DS.Tables[0].Columns.Count; i++)
                {
                    DS1.Tables[0].Columns.Add(
                       DS.Tables[0].Columns[i].ColumnName);
                }
            }
            DataRow dr = DS1.Tables[0].NewRow();
            for (int i = 0; i < DS.Tables[0].Columns.Count; i++)
            {
                dr[DS.Tables[0].Columns[i].ColumnName] = 
                   DS.Tables[0].Rows[inti][i].ToString();
            }
            DS1.Tables[0].Rows.Add(dr);
        }
        DS1.Tables[0].AcceptChanges();
        Paging1.PageSize = PageSize;
        Paging1.TotalRecord = TotalRecords;
        Paging1.CurrentPage = PageIndex + 1;
        Paging1.DataLoad();
        */

        grdTest.DataSource = DS.Tables[0].DefaultView;
        grdTest.DataBind();
    }

    public DataSet GetData()
    {
        DataSet DS = new DataSet();
        SqlConnection Conn = new SqlConnection("Data Source=shradha;" + 
                      "Initial Catalog=Sindhu;user id=sa;password=nitin");
        SqlCommand Comm = new SqlCommand("select * from tbl_Author", Conn);
        SqlDataAdapter AD = new SqlDataAdapter();
        AD.SelectCommand = Comm;
        AD.Fill(DS);
        return DS;
    }
    public void Paging_Click(object sender, CommandEventArgs e)
    {
        string CurrentPage = e.CommandArgument.ToString();
        grdTest.PageIndex = Convert.ToInt32(CurrentPage) - 1;
        DataLoad();
    }
}

Please download the sample project to see a demo.

License

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

Written By

Nitin Sindhu

Product Manager

India

Nitin Kr Sindhu is a Master of Computer Application(MCA).
He is working with .Net technologies in web development since 2004.
Working in various languages like C#, VB.NET and Use Database with Access & MS SQL Server
with Javascript, AJAX, ASP.NET.

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

GridView / DataList Paging Control

Introduction

Using the code

License

Comments and Discussions