Row Pagination
LyteNyte Grid enables you to paginate rows, dividing them into navigable groups based on a specified page size.
For pagination to work, your row data source must support it by implementing the paginateGetCount
and paginateRowStartAndEndForPage methods. The LyteNyte Grid
Server Data Source and
Client Data Source support pagination out of the box.
The free Core edition of LyteNyte Grid includes pagination support through its built-in client
data source.
Enabling Row Pagination
Enable row pagination by setting the paginate property on the grid to true. This activates
paginate mode, where the grid requests rows for each page. The total number of pages equals
pageSize / rowCount.
Page Size
Set the paginatePageSize property to determine how many rows appear on each page. LyteNyte Grid
uses this value divided by the total row count to calculate the number of pages in the grid.
Changing The Current Page
Use the paginateCurrentPage property in the grid's state to set which page the grid displays.
As a grid state property, you can use it reactively in your applications.
Accessing Rows For a Specific Page
Row data sources typically implement pagination by splitting rows into groups based on the page size.
To fetch rows for a specific page, use the paginateRowStartAndEndForPage API method to get the
start and end row indices. Then use the rowByIndex API method to retrieve those rows.
// Get the start and end rows for the 3rd page (page counting starts at 0)
const [rowStart, rowEnd] = grid.api.paginateRowStartAndEndForPage(2);
const rows = Array.from({ length: rowEnd - rowStart }, (_, i) =>
grid.api.rowByIndex(i)
);