This sample shows how to use the paging option to break and load a large data source into chunks and display them page by page. You can also use the built-in navigation buttons to move between pages.
|
Pager Position
|
|
|
Show Pager
|
|
|
Show Page Size
|
|
|
Compact View
|
|
|
Inverse Pager
|
|
The pivot table provides an optimized way to render rows and columns page by page without displaying the entire pivot data. To enable paging, set the enablePaging property to true. You can also configure page information for row and column, such as page size, current page, and so on, using the pageSettings. The pageSettings properties are explained in-detail below: currentRowPage : Holds the current page number, row-wise. You can also change the page number at runtime. currentColumnPage : Holds the current page number, column-wise. You can also change the page number at runtime. rowPageSize : Indicates the number of records to be displayed in each page, row-wise. You can also change the page size at runtime. columnPageSize : Indicates the number of records to be displayed in each page, column-wise. You can also change the page size at runtime. Also, you can customize the paging UI by changing the position, visibility, page size, and other settings for row and column using the pagerSettings. The pagerSettings properties are explained in-detail below: position : Display the pager UI either at top or bottom of the Pivot Table. isInversed : Toggle and display the row and column pagers. showRowPager : Show or hide the row pager in the pager UI. showColumnPager : Show or hide the column pager in the pager UI. showRowPageSize : Show or hide the pre-defined page sizes in the row pager UI. showColumnPageSize : Show or hide the pre-defined page sizes in the column pager UI. rowPageSizes : Allows you to assign a set of pre-defined page sizes in the pager UI's "Rows per page" dropdown, which can be used to change the number of records displayed in row at runtime. columnPageSizes : Allows you to assign a set of pre-defined page sizes in the pager UI's "Columns per page" dropdown, which can be used to change the number of records displayed in column at runtime. enableCompactView : Allows the paging UI to be displayed with minimal design by hiding all paging information except navigation options. template : Allows you to change the appearance of the pager UI by displaying user-defined HTML elements instead of built-in HTML elements. Injecting Module: The pivot table features are segregated into individual modules. To use the paging option, we need to inject the Pager module using the PivotView.Inject(Pager) method. More information on the paging can be found in this documentation section.