Paging Data

Fetching the details of every customer is very useful, but suppose there are a large number of rows in the Customers table. It is highly unlikely that a user would actively want to browse

thousands of rows, so generating a long page displaying them all would be a waste of time and network bandwidth. Instead, it would be far better to display data in chunks and enable the user to page through that data. This is what you will do in the following set of exercises.

Modify the GridView control to use paging

1.Click the Design button to display the CustomerData.aspx Web form in the Design View window, and then click the CustomerGrid control.

2.In the Properties window, set the AllowPaging property to True.

A footer is added to the CustomerGrid control containing a pair of page numbers. This footer is referred to as the pager. The style shown for the footer is the default format, composed of page numbers that the user can click.

3.Expand the PagerSettings composite property. You can use the values in this property

to customize the format of the page navigation links. You can specify page navigation links in two ways: as page numbers or as next/previous page arrows. Set the Mode property to NumericFirstLast to display page numbers with the first and last page

arrows displayed to enable the user to move quickly to the start or end of the data. Set the PageButtonCount subproperty to 5; this will cause page links to be displayed in groups of five. (You will see what this does when you run the Web application in a moment.)

If you want to use next/previous page arrows, you can change the default text displayed (“>” and “<”) by modifying the values of the NextPageText and PreviousPageText

properties. Similarly, you can change the text displayed for the first and last page links by editing the FirstPageText and LastPageText properties. Notice that the values in these properties require encoding as HTML characters; otherwise, they will not be displayed

properly (for example, the “>” symbol must be specified as “>”). If you prefer, you can also specify the name of an image file in the FirstPageImageUrl, LastPageImageUrl, PreviousPageImageUrl, and NextPageImageUrl properties. The page navigation links will appear as buttons containing these images if supported by the browser.

4.In the Properties window, set the PageSize property to 8.

This setting causes the CustomerGrid to fetch and display data in eight-row chunks.

5.Expand the PagerStyle composite property. You can use this property to specify how the pager should be formatted. Set the HorizontalAlign subproperty to Left.

The numbers in the pager move to the left margin in the CustomerGrid control.