Pagination Bar

The WorkWithPlus Pattern Settings editor, General Properties tab, shows the Actions category with a tree list of configurable action nodes including Export, ExportReport, ExportCSV, Help, Tm_First/Previous/Next/Last, Tm_Select, Tm_Enter, Tm_Cancel, Tm_Delete, Confirm, Cancel, Search, Refresh, DynFilterAdd/Remove, PageFirst/Previous/Next/Last, EditColumns, CleanFilters, ManageFilters, EditableGrid actions, CopyRecord, Wizard navigation actions, and the highlighted Pagination Bar entry at the bottom.

Pagination Bar has the following properties:

Category Property  
General Properties Include Pagination Bar

The Properties panel for the Pagination Bar node in WorkWithPlus lists configuration values: Include Pagination Bar (True), Include Rows Per Page Selector (True), Theme Class (PaginationBar), Empty Grid Theme Class, Show First/Previous/Next/Last Button flags, Max Pages To Show (5), Paging Buttons Position (Right), Paging Caption Position (Left), a Labels group with caption keys such as WWP_PagingCaption, and a Rows per page group with Rows Per Page Options set to '5:5 rows,10:10 rows,20:20 rows,50:50 rows,0:All rows'.

Include Rows Per Page Selector
Theme Class
Empty Grid Theme Class
Show First Button
Show Previous Button
Show Next Button
Show Last Button 
Max Pages To Show
Pagination Buttons Position
Pagination Caption Position
Labels Paging Caption
Empty Grid Caption
First Caption
Previous Caption
Next Caption
Last Caption
Rows Per Page Caption
Rows Per Page Rows Per page Options


General Properties:

:

Specifies the default value for this property on grid nodes. This property specifies whether to include or not the pagination bar at the bottom of the grid. When this property is True, the grid will look like the following image:

A generated WorkWithPlus grid displays Id, Full Name, First Name, Last Name, and Company columns for a Person list, showing page 5 of 21 with rows like Lookman Mary, Hall Leif, Gomez Nicholas, and pagination controls Prev, page numbers 3-7, and Next at the bottom.

Include Rows Per Page Selector:

Specifies the default value for this property on grid nodes. This property specifies whether to include or not the rows per page selector at the bottom of the grid.

Theme Class:

Specifies the theme class that will be applied to the pagination bar.

Empty Grid Theme Class:

Specifies the theme class that will be applied to the pagination bar when the grid has no records. The default class will have the following look & feel for empty grids:

An empty WorkWithPlus grid header shows the columns Id, Full Name, First Name, Last Name, and Company with sort/filter dropdown arrows, and below it the empty-state message 'No records found.' indicating no matching data for the current filter.

Show First Button:

Specifies whether to display or not the button which navigates to the first page of the grid.

:

Specifies whether to display or not the button which navigates to the previous page of the grid. 

:

Specifies whether to display or not the button which navigates to the next page of the grid.

Show Last Button:

Specifies whether to display or not the button which navigates to the last page of the grid. 

Max Pages To Show:

Specifies the maximum amount of pages to display in the buttons section. In the image above, the maximum is 5.  

Paging Buttons Position:

Specifies whether the paging buttons (First, Previous, Next, Last, and the specific number of pages) will be displayed at the left or the right corner of the grid.

Paging Caption Position:

Specifies whether the paging caption (i.e. Page 1 of 10) will be displayed at the left or the right corner of the grid. 

Properties Of Category Labels:

Paging Caption:

Specifies the caption that will be displayed related to the paging information (page and records displayed, total number of pages or records, etc.). You can use the following tags:

  • <FIRST_RECORD>: represents the first record index of the current page. For example, if the grid displays 9 items per page, and now is displaying the third page, this tag will show the value 19
  • <LAST_RECORD>: represents the last record index of the current page. For example, if the grid displays 9 items per page, now is displaying the third page, and the grid contains more than 27 records, this tag will show the value 27
  • <TOTAL_RECORDS>: represents the total amount of records that the grid will display.
  • <CURRENT_PAGE>: represents the index of the current page.
  • <TOTAL_PAGES>: represents the total amount of pages that the grid will display.

A WorkWithPlus grid listing Person records with Id, First Name, Last Name, Full Name, Nickname, Birth Date, Hobby, Gender, and Company columns is annotated with red callout boxes and arrows labeling the pagination caption elements FIRST_RECORD, LAST_RECORD, and TOTAL_RECORDS in the 'Records 10-18 of 20' status text at the bottom left.

A WorkWithPlus grid of Person records (Id, Full Name, First Name, Last Name, Company) is annotated with red callouts pointing to the 'Page 5 of 21' caption at bottom left, labeling the CURRENT_PAGE and TOTAL_PAGES placeholder tokens used in the pagination label.

Empty Grid Caption:

Specifies the caption that will be displayed when the grid has no records to show.

First Caption:

Specifies the caption that will be shown for the button that navigates to the first page.

:

Specifies the caption that will be shown for the button that navigates to the previous page.

:

Specifies the caption that will be shown for the button that navigates to the next page.

Last Caption:

Specifies the caption that will be shown for the button that navigates to the last page.

Rows Per Page Caption:

Specifies the caption of the rows per page control.

Properties Of Category Rows Per Page:

Rows Per page Options:

Specifies the options that the control will have. The sintax is <NumberOfRows>:<CaptionOfTheItem>