Jul 15th, 2005, 03:46 AM
#1
Creating your own DataGrid Paging Control
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:
Code:
<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> <asp:textbox id="txtPageNumber" Runat="server" Width="20"></asp:textbox> <asp:label id="lblOf" Runat="server"></asp:label> <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,
VB Code:
Imports System.Text.RegularExpressions
That's the only Imports required, you'll see why later.
Then,
VB Code:
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:
VB Code:
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
Attached Images
Last edited by mendhak; Aug 21st, 2006 at 11:02 AM .
Jul 15th, 2005, 03:49 AM
#2
Re: Creating your own DataGrid Paging Control
On my page, I placed a datagrid and below that, the paging control.
Code:
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<asp:DataGrid id="DataGrid1" runat="server" AllowPaging="True" Width="100%">
<PagerStyle Visible="False" NextPageText="" PrevPageText=""></PagerStyle>
</asp:DataGrid>
<uc1:PagingControl id="PagingControl1" runat="server"></uc1:PagingControl>
</td>
</tr>
</table>
In the codebehind,
VB Code:
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.PagingControl1.CSSTextBoxClass = "iStyle"
Me.PagingControl1.CSSButtonClass = "buttonStyle"
Me.PagingControl1.CSSFooterDisplayClass = "dgFooterStyle"
If Not Page.IsPostBack Then
bindgrid()
End If
End Sub
Private Sub bindgrid()
Dim totalCount As Integer
Dim con As SqlConnection = New SqlConnection("data source=xxxxxx;initial catalog=pubs;Uid=xxxxxxxxx;pwd=xxxxxxxxx;packet size=4096;")
Dim cmd As SqlCommand = New SqlCommand("Get_Employees", con)
cmd.CommandType = CommandType.StoredProcedure
Dim param As SqlParameter = cmd.Parameters.Add("@CurrentPage", SqlDbType.Int)
param.Direction = ParameterDirection.Input
param.Value = PagingControl1.CurrentPage
param = cmd.Parameters.Add("@PageSize", SqlDbType.Int)
param.Direction = ParameterDirection.Input
param.Value = 10
param = cmd.Parameters.Add("@TotalRecords", SqlDbType.Int)
param.Direction = ParameterDirection.Output
Dim da As SqlDataAdapter = New SqlDataAdapter(cmd)
Dim ds As DataSet = New DataSet
da.Fill(ds)
totalCount = CInt(cmd.Parameters("@TotalRecords").Value)
DataGrid1.DataSource = ds
DataGrid1.DataBind()
If (totalCount Mod 10) = 0 Then
PagingControl1.TotalPages = totalCount / 10
Else
PagingControl1.TotalPages = (totalCount / 10) + 1
End If
da.Dispose()
cmd.Dispose()
con.Close()
con.Dispose()
End Sub
Private Sub PagingControl1_PageChanged(ByVal sender As Object, ByVal e As DataNavigatorEventArgs) Handles PagingControl1.PageChanged
Me.PagingControl1.CurrentPage = e.CurrentPage
bindgrid()
End Sub
Be sure to set the AllowPaging property of the datagrid to true, and the PagerStyle.Visible property to false.
Last edited by mendhak; Jul 15th, 2005 at 04:54 AM .
Jul 15th, 2005, 04:55 AM
#3
Re: Creating your own DataGrid Paging Control
And finally, this is what the GET_EMPLOYEES SP looks like:
Code:
CREATE PROCEDURE Get_Employees( @CurrentPage int,
@PageSize int,
@TotalRecords int OUTPUT)
AS
-- Turn off count return.
Set NoCount On
-- Declare variables.
Declare @FirstRec int
Declare @LastRec int
-- Initialize variables.
Set @FirstRec = (@CurrentPage - 1) * @PageSize
Set @LastRec = (@CurrentPage * @PageSize + 1)
-- Create a temp table to hold the current page of data
-- Add an ID column to count the records
Create Table #TempTable
(
EmpId int IDENTITY PRIMARY KEY,
fname varchar(20),
lname varchar(30),
pub_id char(4),
hire_date datetime
)
--Fill the temp table with the reminders
Insert Into #TempTable
(
fname,
lname,
pub_id,
hire_date
)
Select fname,
lname,
pub_id,
hire_date
From employee
Order By lname
--Select one page of data based on the record numbers above
Select fname,
lname,
pub_id,
hire_date
From #TempTable
Where EmpId > @FirstRec
And EmpId < @LastRec
--Return the total number of records available as an output parameter
Select @TotalRecords = Count(*)
From #TempTable
GO
Posting Permissions
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
Forum Rules
Click Here to Expand Forum to Full Width