When you think ASP, think...
Recent Articles xml
All Articles
ASP.NET Articles
Related Web Technologies
User Tips!
Coding Tips
spgif spgif

Book Reviews
Sample Chapters
JavaScript Tutorials
MSDN Communities Hub
Official Docs
Stump the SQL Guru!
Web Hosts
Author an Article
spgif spgif

ASP ASP.NET ASP FAQs Feedback topnav-right
Print this Page!
Published: Wednesday, July 9, 2003

An Extensive Examination of the DataGrid Web Control: Part 15

By Scott Mitchell

The 15th Part in a Multi-Part Series
This article is the fifteenth piece of a multi-part series on using the DataGrid Web control that will span several months. The ASP.NET DataGrid Web control, which displays database information in an HTML table, is highly versatile. The basics of the DataGrid were discussed in Part 1; information on specifying display properties of the DataGrid was discussed in Part 2. In Part 3 we examined how to associate custom events with the DataGrid. In Part 4 we looked at how to extend Part 3 to provide custom sorting on the results of a DataGrid. In Part 5 we examined how to use templates to further customize the DataGrid's appearance. Part 6 examined how to use the DataGrid's built-in editing capabilities, while Part 7 looked at customizing the editing interface using the EditItemTemplate. In Part 8 we looked at how to add client-side code to a ButtonColumn's client-side onclick event. In Part 9 we examined how to enhance the DataGrid's editing interface by having the editing interface's TextBox receive focus when the page is loaded. In Part 10 we looked at how to (automatically) add filtering buttons so that one can filter the data in a DataGrid. In Part 11 we examined how to create a DataGrid Web control with a column of related radio buttons. In Part 12 we examined how to create a sortable DataGrid that can be sorted in ascending and descending order. Part 13 examined how to sum up a DataGrid column and have the sum displayed in the footer. Part 14 looked at how to build a master/detail DataGrid. This part examines a long overdue topic for this article series: seeing how to add paging support to the DataGrid!

- continued -

  • Read Part 16
  • Read Part 17
  • Read Part 18
  • ASP.NET Data Web Controls Kick Start

    ASP.NET Data Web Controls Kick Start

    ASP.NET Data Web Controls Kick Start is author Scott Mitchell's most recent book, which thoroughly examines three of the most commonly used ASP.NET Web controls: the DataGrid, DataList, and Repeater. These three Web controls can be difficult to master due to their numerous features and capabilities. With this book, you'll quickly become an expert, learning the gritty details and true capabilities of each. This 400+ page book explores the topics in this article series in much greater depth, along with examining various topics and techniques not covered here.

    Scott Mitchell is the editor and founder of 4GuysFromRolla.com, author of the An Extensive Examination of the DataGrid Web Control article series, and author of numerous other ASP and ASP.NET books.

    [Buy this Book]
    [Visit the Book's Companion Web Site]


    As discussed in previous articles, the DataGrid makes displaying database data an absolute breeze. All it takes is configuring the DataGrid's properties and writing two lines of code. While this simple approach works great for displaying relatively small amounts of data, displaying large amounts of data can result in exceptionally large DataGrids. Such large DataGrids have two main disadvantages:

    1. Readers cannot be expected to be able to digest such large blocks of information, and
    2. Dumping large amounts of data in one Web page leads to large Web page sizes, which can take unbearably long to download on dial-up connections.

    Focusing on the first disadvantage, realize that when presenting your users with information, you want to do so in small, manageable chunks. Blasting all of the data to the screen at once can be overwhelming for the person visiting the Web page. For example, searching Google for the term "DataGrid" yields roughly 217,000 results. Thankfully, though, Google only presents 10 of them at a time!

    In this article we will see how to use the DataGrid's built-in paging facilities in order to display database data in manageable chunks.

    Paging Support in the DataGrid

    The DataGrid supports two kinds of paging:

    1. Default paging, and
    2. Custom paging

    Default paging, which this article focuses on, is the simpler of the two to setup and configure. As we will see, getting default paging to work only requires a few minor modifications to the standard process of displaying data in a DataGrid.

    The major difference between default paging and custom paging is this: with default paging, each time you want to display a page of data in the DataGrid, you need to grab all of the data from the underlying data source. Then, the DataGrid only selectively displays part of the entire set of data, based on what page you want to display and how many records per page to display. The key thing to understand here is that everytime the page is loaded, the entire data result is retrieved.

    For example, imagine that you work at an eCommerce company and you want to allow the user to page through a list of the 150 products your company sells. Specifically, you want to display 10 records per page. Now, when a user visits the Web page, you will access all 150 records, and the DataGrid will display the first 10 products (products 1 to 10). Next, imagine that the user navigates to the next page of data. This will cause a postback, at which point you'll rerequest all 150 records, but this time the DataGrid will display the second set of 10 (products 11 to 20).

    With custom paging, you, the developer, have to do a bit more work. Rather than just being able to blindly bind database data to the DataGrid, you have to selectively retrieve only those records that should be shown for the particular page. The benefit of this is that when displaying the first page of data, you can use a SQL statement that only retrieves products 1 through 10, rather than all 150 records. However, your SQL statement has to be "clever" enough to be able to know how to just snip out the right subset of records from the 150.

    The Performance Edge of Custom Paging
    Realize that custom paging provides better performance than default paging because only those database records that need to be displayed are retrieved. In our products example, we assumed there were 150 products, showing 10 per page. With custom paging, if the user stepped through all 15 pages of data, precisely 150 records would have been queried from the database. With default paging, however, for each page of data, 150 records would have been accessed, leading to a total number of retrieved records of 15 times 150, or 2,250!

    While custom paging exhibits better performance, default paging is much easier to use. Therefore, I would encourage you to use default paging if the data you are paging through is relatively small and/or the database server is not heavily trafficked. If you have thousands of tens of thousands of records you are paging through, by all means use custom paging. However, for paging through something like the ASPFAQs.com database, which only has, currently, ~200 FAQs, default paging is sufficient.

    Understanding How the DataGrid Implements Paging

    Before we examine how to add paging support, it's imperative that we take a moment to discuss how the DataGrid implements paging. The DataGrid contains a handful of properties designed to aid in paging:

    • CurrentPageIndex - indicates what page of data to display. This property is indexed at zero, meaning to display the first page of data, this property's value should be 0; to display the second page of data, this property's value should be 1; and so on. (This property's default value is 0, so by default the first page of data will be displayed.)
    • PageSize - indicates how many records to show per page.
    • PageCount - indicates how many total pages of data there are. This value is computed by the ceiling of the number of total records divided by the number of records per page.
    • AllowPaging - this Boolean property indicates whether or not the DataGrid is pageable. In order to use the DataGrid's built-in paging features, you need to set this to True.

    There are some additional paging properties that are germane to custom paging; however, this article will be focusing on default paging.

    Pageable DataGrid's automatically display a paging interface. This paging interface is customizable but, by default, displays a left and right arrow hyperlink for navigating to the previous and next pages. When a user clicks on one of these navigational hyperlinks, the ASP.NET Web page is posted back and the DataGrid's PageIndexChanged event fires. Essentially, to provide paging support you need to add an event handler that responds to this event. Specifically, the event handler needs to correctly adjust the DataGrid's CurrentPageIndex property and rebind the DataGrid. We'll see how, exactly, to accomplish this in Part 2!

  • Read Part 2!

  • ASP.NET [1.x] [2.0] | ASPMessageboard.com | ASPFAQs.com | Advertise | Feedback | Author an Article