Creating your own DataGrid Paging Control

[mendhak]

Personally, I am not very fond of the default paging control that the DataGrid has. Instead, I'd like something like this:



So that the user can enter the page number and go directly. Of course, not everyone would want the same thing, but it really depends upon your needs.

To start with, create a new web user control in your project, call it PagingControl.ascx.

In the HTML:

<table cellSpacing="0" cellPadding="0" width="100%" border="0">
	<tr>
		<td align="center" id="tdFooterDisplay" runat="server" height="5px">
			<asp:Label ID="lblCurrentPageNumber" Runat="server"></asp:Label>
		</td>
	</tr>
	<tr>
		<td align="right"><asp:label id="lblPage" Runat="server"></asp:label>&nbsp;<asp:textbox id="txtPageNumber" Runat="server" Width="20"></asp:textbox>&nbsp;<asp:label id="lblOf" Runat="server"></asp:label>&nbsp;<asp:label id="lblTotalPages" Runat="server"></asp:label>
			<asp:button id="btnGo" Runat="server"></asp:button>
			<asp:RegularExpressionValidator Text="*" ControlToValidate="txtPageNumber" id="RegularExpressionValidator1" runat="server"
				ValidationExpression="\d"></asp:RegularExpressionValidator></td>
	</tr>
</table>

In its codebehind,

Imports System.Text.RegularExpressions

That's the only Imports required, you'll see why later.

Then,

Public Delegate Sub PageChangedEventHandler(ByVal sender As Object, ByVal e As DataNavigatorEventArgs)
 
 
 
    Public Event PageChanged As PageChangedEventHandler
 
 
 
 
 
    Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        'Put user code to initialize the page here
 
 
        Me.btnGo.CssClass = Me.CSSButtonClass
        Me.txtPageNumber.CssClass = Me.CSSTextBoxClass
        Me.tdFooterDisplay.Attributes.Add("class", Me.CSSFooterDisplayClass)
 
 
 
        Me.lblOf.Text = "Of"
        Me.lblPage.Text = "Page"
        Me.btnGo.Text = "Go"
 
 
 
        If Not Page.IsPostBack Then
            Me.txtPageNumber.Text = Me.CurrentPage.ToString
            Me.lblTotalPages.Text = Me.TotalPages.ToString
            Me.lblCurrentPageNumber.Text = Me.CurrentPage.ToString.Trim
        End If
        
 
 
    End Sub
 
 
 
 
    'Protected Sub OnPageChangedButton(ByVal sender As Object, ByVal e As EventArgs)
    '    Dim args As DataNavigatorEventArgs = New DataNavigatorEventArgs
    '    args.CurrentPage = Integer.Parse(txtPageNumber.Text)
    '    args.TotalPages = Integer.Parse(lblTotalPages.Text)
    '    OnPageChanged(args)
 
    'End Sub
 
    Protected Sub OnPageChanged(ByVal args As DataNavigatorEventArgs)
 
        RaiseEvent PageChanged(Me, args)
 
    End Sub
 
 
 
    Private _intCurrentPage As Integer = 1
    Private _intTotalPages As Integer
    Private _strButtonCSSClass As String
    Private _strTextBoxCSSClass As String
    Private _strCSSFooterDisplayClass As String
 
 
 
    Public Property CSSFooterDisplayClass() As String
        Get
            Return _strCSSFooterDisplayClass
        End Get
        Set(ByVal Value As String)
            _strCSSFooterDisplayClass = Value
        End Set
    End Property
 
 
    Public Property CurrentPage() As Integer
        Get
            Return _intCurrentPage
        End Get
        Set(ByVal Value As Integer)
            _intCurrentPage = Value
 
        End Set
    End Property
 
    Public Property TotalPages() As Integer
        Get
            Return _intTotalPages
 
        End Get
        Set(ByVal Value As Integer)
            _intTotalPages = Value
 
        End Set
    End Property
 
    Public Property CSSButtonClass() As String
        Get
            Return _strButtonCSSClass
        End Get
        Set(ByVal Value As String)
            _strButtonCSSClass = Value
        End Set
    End Property
 
    Public Property CSSTextBoxClass() As String
        Get
            Return _strTextBoxCSSClass
        End Get
        Set(ByVal Value As String)
            _strTextBoxCSSClass = Value
        End Set
    End Property
 
 
    Private Sub btnGo_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnGo.Click
 
        Dim args As New DataNavigatorEventArgs
        args.CurrentPage = Integer.Parse(Me.txtPageNumber.Text)
        args.TotalPages = Integer.Parse(Me.lblTotalPages.Text)
        OnPageChanged(args)
        Me.lblCurrentPageNumber.Text = args.CurrentPage.ToString()
    End Sub

That constitutes the code for your PagingControl class. You also need to create a DataNavigatorEventArgs class:

Public Class DataNavigatorEventArgs
    Inherits EventArgs
 
 
    Private m_iCurrentPage As Integer
    Private m_iTotalPages As Integer
 
    Public Sub New()
 
    End Sub
 
    Public Property CurrentPage() As Integer
        Get
            Return m_iCurrentPage
        End Get
        Set(ByVal Value As Integer)
            m_iCurrentPage = Value
        End Set
    End Property
 
    Public Property TotalPages() As Integer
        Get
            Return m_iTotalPages
        End Get
        Set(ByVal Value As Integer)
            m_iTotalPages = Value
        End Set
    End Property
 
 
End Class

That's it. Your paging control is now ready. Use it as shown in the next post



Keywords: mendhak custom datagrid paging pineapples