ComponentOne GridView for ASP.NET AJAX: GridView for ASP.NET AJAX Task-Based Help > Creating a Pageable Grid > Adding Paging

Adding Paging

This topic demonstrates how to display the contents of C1GridView on multiple pages, navigate through those pages and set the number of items to be displayed on each page.

In the Designer

Complete the following steps:

1.   Right-click the C1GridView control and then click Show Smart Tag. On the C1GridView Tasks menu, click Property builder. The C1GridView Properties window appears.

2.   Select the Paging tab and check the Allow paging check box. This sets the AllowPaging property to True.

3.   Specify the number of rows to appear on the page in the Page size text box, for example "4".

4.   The Show navigation check box under Page navigation is checked by default. This places the page navigation buttons on the page. You can specify their location on the page by clicking the Position drop-down arrow and selecting Bottom, Top, or TopAndBottom. The Mode property is set to Numeric by default, so numeric navigation buttons appear on the page.

In Source View

Complete the following steps:

1.   Add AllowPaging="True" and PageSize="4" to the <cc1:C1GridView> tag to set the AllowPaging property to True and the PageSize property to move through the pages of data from the data source four items at a time:

<cc1:C1GridView ID="C1GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="AccessDataSource1" VisualStylePath="~/C1WebControls/VisualStyles" AllowPaging="True" PageSize="4">

The Mode property is set to Numeric by default, so numeric navigation buttons appear on the page.

2.   If you want to change the position of the navigation buttons, set the Position to Top or TopAndBottom by adding <PagerSettings Position="TopAndBottom"/> or <PagerSettings Position="TopAndBottom"/> between the <cc1:C1GridView> and </cc1:C1GridView> tags.

In Code

Complete the following steps:

1.   Set AllowPaging property to True and PageSize to 4 to move through the pages of data from the data source four items at a time. The Mode property is set to Numeric by default, so numeric navigation buttons appear on the page.

      Visual Basic

C1GridView1.AllowPaging = True

C1GridView1.PageSize = 4

      C#

C1GridView1.AllowPaging = true;

C1GridView1.PageSize = 4;

2.   If you want to change the position of the navigation buttons, set the Position to Top or TopAndBottom.

 What You've Accomplished

Run your application and observe that paging controls appear at the bottom of the grid, and that 4 items are displayed on each page:

 


Send comments about this topic to ComponentOne.
Copyright © ComponentOne LLC. All rights reserved.