JavaScript Editor jscript editor     Web designer 

Main Page

The ASP.NET GridView control has a built-in paging capability that supports basic paging functionality. You can use the default paging user interface (UI) or create a custom paging interface.

How Paging Works in the GridView Control

The GridView control supports paging over the items in its data source. You set the AllowPaging property to true to enable paging. The GridView control supports paging in one of these ways:

  1. If the GridView control is bound to a data source control that supports the paging capability at the interface level, the GridView control will take advantage of that capability directly. Paging at the interface level means that the GridView control requests only as many records from the data source as are needed to render the current page. The number of records requested may vary depending on other factors, such as whether the data source supports getting the total record count, the number of records per page specified by the PageSize property, and the number of pager buttons to display when the PageButtonCount property is set to Numeric.


    Of the data source controls that are included in the .NET Framework, only the ObjectDataSource control supports paging at the interface level.

  2. If the GridView control is bound to a data source control that does not support the paging capability directly, or if the GridView control is bound to a data structure in code through the DataSource property, the GridView control will perform paging by getting all of the data records from the source, displaying only the records for the current page, and discarding the rest. This is supported only when the data source for the GridView control returns a collection that implements the ICollection interface (including datasets).


    If the data source does not support paging directly and does not implement the ICollection interface, the GridView control cannot page. For example, if you are using a SqlDataSource control and have set its DataSourceMode property to DataReader, the GridView control cannot implement paging.

Customizing the Paging Settings and User Interface

You can customize the paging user interface of the GridView control in a number of ways. You can set the size of the page (that is, the number of items to display at once) using the PageSize property. You can also set the current page of the GridView control by setting the PageIndex property. You can specify more custom behavior using either the PagerSettings property or by supplying a pager template.

Paging Modes

The PagerSettings property allows you to customize the appearance of the paging user interface (UI) that is automatically generated by the GridView control when you set the AllowPaging property to true. The GridView control can display direction controls that allow forward and backward navigation as well as numeric controls that allow a user to move to a specific page.

The PagerSettings property of the GridView control is set to a PagerSettings class. You can customize the paging mode by setting the Mode property of the GridView control. For example, you can customize the paging UI mode by setting it as follows:

В CopyCode imageCopy Code
GridView1.PagerSettings.Mode = PagerButtons.NextPreviousFirstLast

The available modes are:

  • NextPrevious

  • NextPreviousFirstLast

  • Numeric

  • NumericFirstLast

Pager Control Appearance

The GridView control has numerous properties that you can use to customize the text and images for different pager modes. For example, if you want to allow navigation using direction buttons but want to customize the text that appeared, you can customize the button text by setting the NextPageText and PreviousPageText properties, as in the following example:

В CopyCode imageCopy Code
GridView1.PagerSettings.NextPageText = "Click for next page"
GridView1.PagerSettings.PreviousPageText = "Click for previous page"

You can also use images to customize the appearance of your paging controls. The PagerSettings class includes image URL properties for the first, last, previous, and next page command buttons.

Finally, you can control the appearance of the paging commands by setting the PagerStyle property of the GridView control to a TableItemStyle value.

Data Paging Template

If you set the AllowPaging property of the GridView control to true, the GridView control automatically adds user interface (UI) controls for paging. You can customize the UI for paging by adding a PagerTemplate template. To specify which paging operation to perform, include a Button control with its CommandName property set to Page and a CommandArgument set to one of the following values:

  • FirstВ В В To move to the first page.

  • LastВ В В To move to the last page.

  • PrevВ В В To move to the previous page.

  • NextВ В В To move to the next page of data

  • A numberВ В В To move to a specific page.

Paging Events

The GridView control raises two events when it moves to a new page of data. The PageIndexChanging event occurs before the GridView control performs the paging operation. The PageIndexChanged event occurs after the new page of data has been returned to the GridView control.

You can use the PageIndexChanging event to cancel the paging operation, if needed, or to perform a task before the GridView control requests a new page of data. You can use the PageIndexChanged event to perform a task after the user moves to a different page of data.

See Also

JavaScript Editor jscript editor     Web designer