When Completed

Your NetCharts Designer perspective will appear like this:
 

Getting Started

Start by closing any open editors. Go to NetCharts Designer’s File menu and select the Close All option.
 
Next, create a new project named TablePaginationProject.

Create Datasets

From the toolbar click on the Create a New Dataset wizard. Name your new dataset employeeData, select Hypersonic SQL from the Data Sources list, and Click Next.
 
Use the Query Builder and Select the EMPLOYEE table, then select the EMPLOYEE_ID,WAGE_CLASS, ANNUAL_SALARY, ETHNICITY, and GENDER columns.
 

 
Click Next and then Finish. This will return you to the Data Connection wizard. Click the Execute SQL button and prove to yourself that 831 rows will be returned. Click OK.
 

 
This creates an ungainly table, but pagination will make it manageable. Click Finish again. The first 50 rows are shown in the Preview Browser
 

Create a table

Create a table. From the toolbar click on the Create a New Table icon. Call it PaginatedTable. Click Next then click Finish.
 

Style the table, and configure the preservation of Column Headers.

Confirm Use First Row As Column Header checkbox is checked in the Column Properties group. This will preserve row 0 as the first row displayed with each page of the table.
 
Click on the pencil in a box button next to the Table Style in the Table Properties group. When the table style dialog appears, click the new button, and name the new style PaginationTableStyle, and click OK. Check the Style Text check box in the Text group. In the Table Border group, set the width of each border to 3 pixels, and set the Style dropdown menu to Double. Set the border color to a blue the color chooser.
 
The new table style configuration looks like this:
 

 
Click OK, and your table appears like this:
 

 
Click the pencil icon next to the Alternate Row Style drop down in the Row Properties group. Name the new Style, AltRowStyle, and click OK. In the Background fill group, select Solid from the Fill Type drop down menu. Click the Background Color button, and when the color chooser dialog appears, click the Define Custom Colors button. Chose the same blue as above , and then move the color slider on the right to the upper 1/6th of the range. Click the Add to Custom Colors button, and save the resulting very light blue color, by clicking OK:
 

 
Click OK to the style dialog.

Enable Pagination.

Click on the Pagination tree node in the lower left hand window of the editor panel. Click the Enable Pagination button in the Pagination group.
 
In the Pagination Settings group, set the Limit Number of Pages Displayed spinner to 4.
 

 
Click on different pages including the Next > and Previous <, and the Beginning << and End >>links. The last page of the table appears like this:
 

 

Additional Styling

Some minor tweaking of the styles of the table can really improve its appearance. Notice all the different properties of the pagination control that can be individually styled by the drop down menus in the Pagination Control Styles and Pagination Label Styles groups.
 
Select Top & Bottom from the Control Placement drop down menu.
 
Create a Control Style and call it ControlStyle. Select an 10 point Bold Arial font, Select a solid background color using the light blue saved earlier, and put a 1 pixel solid border around the control using the blue from the top of the color chooser table of preset colors. Your style dialog will appear like this:
 

 
Your table should appear like this:
 

 
Create a Style for the Active Pages called ActivePageStyle. Set the font to 11 point bold italic Arialtext style. Select a dark red from the color chooser in the Text group. Your Style Dialog will appear like this:
 

 
…and your table will appear like this:
 

 
Lastly, let’s style the Header Row. Click on the Column Definitions Tree node.
 
Click the Add button in the Column Definitions Group. Make sure the number for which the next column definition to be added is set to 0 before adding the definition
 
Click the pencil in the box button, in the Column Header group, next to the Style Drop Down menu, and call it TableHeaderRowStyle. Click the Style Text check box in the Text group, and select an Arial font, 11 point bold. Select a white color for the font. Then in the Background Fill group. Select Solid from the Fill Type Drop Down menu, and select the original blue color from the color chooser. Your Style dialog will appear like this:
 

 
Click the Add button in the Column Definitions Group 4 more times, and the style given to the first column definition will be inherited by the subsequent definitions. You’re table will appear like this: