Changing Paging Types and Styles

ComponentOne GridView for ASP.NET AJAX: GridView for ASP.NET AJAX Task-Based Help > Creating a Pageable Grid > Changing Paging Types and Styles

This topic demonstrates how to set the pager style at design time and programmatically.

In the Designer

Complete the following steps:

1. In the Property Builder on the Paging tab, click the Mode drop-down arrow and select NextPrevious for < > navigation buttons or Numeric for numbered pages.

2. Select the Format tab and choose Pager under Objects.

3. Set the appearance of the pager by setting the ForeColor, BackColor, FontName, FontSize and Alignment properties.

In Source View

Use the Mode property to set numeric paging. Use additional PagerStyle properties to set the style of the pager. For example, add the following tags between the <cc1:C1GridView> and </cc1:C1GridView> tags:

Set the Mode property to use Next and Previous < > buttons rather than numeric paging. Use additional PagerStyle properties to set the style of the pager. For example, add the following tags between the <cc1:C1GridView> and </cc1:C1GridView> tags:

In Code

Use the Mode property to set numeric paging. Use additional PagerStyle properties to set the style of the pager. For example:

• Visual Basic

C1GridView1.PagerSettings.Mode = PagerMode.Numeric

C1GridView1.PagerStyle.BackColor = Drawing.Color.DarkBlue

C1GridView1.PagerStyle.ForeColor = Drawing.Color.Red

• C#

C1GridView1.PagerSettings.Mode = PagerMode.Numeric;

C1GridView1.PagerStyle.BackColor = Drawing.Color.DarkBlue;

C1GridView1.PagerStyle.ForeColor = Drawing.Color.Red;

Set the Mode property to use Next and Previous < > buttons rather than numeric paging. Use additional PagerStyle properties to set the style of the pager:

• Visual Basic

C1GridView1.PagerSettings.Mode = PagerButtons.NextPrevious

C1GridView1.PagerStyle.HorizontalAlign = HorizontalAlign.Center

C1GridView1.PagerStyle.Height = 50

• C#

C1GridView1.PagerSettings.Mode = PagerButtons.NextPrevious;

C1GridView1.PagerStyle.HorizontalAlign = HorizontalAlign.Center;

C1GridView1.PagerStyle.Height = 50;

Sample Project Available

For the complete sample, see the CustomPaging sample located on the ComponentOne HelpCentral Sample page.

What You've Accomplished

Run your application and observe that the style of the paging controls reflects the changes that you made.