An Extensive Examination of the DataGrid Web Control: Part 15, Part 2By Scott Mitchell
In Part 1 we discussed the differences between default and custom paging, and examined how the DataGrid implements paging in high-level terms. In this part, we'll examine the steps needing to be taken and the code that needs to be added in order to create a pageable DataGrid.
Working with Default Paging
To demonstrate how to add paging support to a DataGrid, let's first take a look at code to display non-paged data first, and then examine the steps needed to "upgrade" the DataGrid to a pageable one. Here is a simple ASP.NET Web page that displays the rows from the ASPFAQs.com database:
Now, taking this simple example we only need to make the following additions:
- Set the DataGrid's
AllowPagingproperty to True. This can be accomplished by simply adding
AllowPaging="True"in the DataGrid declaration.
- Place the DataGrid within a Web Form (the
<form runat="server">). This is needed because navigating through each of the DataGrid's pages of data incurs a postback.
- Update the
BindData()method to use a DataSet instead of a
- Add an event handler for the DataGrid's
The first two steps are brainless ones, and the third one is not too difficult either. The fourth one
seems as if it may be the most difficult, but fortunately, it is quite simple too (with
default paging). All the
PageIndexChanged event handler needs to do is set the DataGrid's
CurrentPageIndex property to the page of data the user wishes to see, and then rebind
the DataGrid. The new, complete code can be seen below:
The bold text indicates the changes from the previous example. The first thing to note is the
NewPage() subroutine, which is the event handler for the DataGrid's
event. Notice that all it does is set the
CurrentPageIndex property and rebind the database
data to the DataGrid. Simple! Another thing to take note of is that we made a small change to the
BindData() method, binding a DataSet to the DataGrid as opposed to a
SqlDataReader. The reason we did this is because default paging requires that the DataGrid
be able to determine the number of total records in the
DataSource. This is possible
with the DataSet, but not with the
SqlDataReader, hence the change.
|If You Try to Use a |
If you accidentally attempt to use a |
AllowCustomPaging must be true and VirtualItemCount must be set for a DataGrid with ID DataGridID when AllowPaging is set to true and the selected datasource does not implement ICollection.
Customizing the Navigational Interface
If you check out the live demo you'll see that, by default, the DataGrid displays the navigational interface as < and > hyperlinks, to navigate to the previous and next pages, respectively. This paging interface can be customized using the PagerStyle property of the DataGrid.
There are two built-in paging styles:
- Next/Previous - in this paging style, the user can move just to the immediately next or immediately previous page, and
- Numeric Pages - in this paging style, the user can jump to a particular page.
The Next/Previous paging style is the default. You can customize this paging style by setting the
PrevPageText properties to the text that you want to
appear for the next and previous hyperlinks. To specify what paging style to use (Next/Previous vs.
Numeric Pages), set the
Mode property to either
For example, the following DataGrid declaration demonstrates customizing the Next/Previous paging
And the following DataGrid declaration demonstrates using the Numeric Pages interface. (Be sure to view both the associated live demos in order to see the various pager styles in action!)
In this article we looked at the paging support in the DataGrid, including the differences between default and custom paging. We then examined the steps necessary to implement default paging in a DataGrid, as well as how to customize the paging interface. For an in-depth look at custom paging, be sure to check out my book, ASP.NET Data Web Controls Kick Start.