Pagination table

Extends the simple table component with pagination functionality.

On the project page, NNM Pagination table, you can read more details and the theory and background on the ideas and decisions.


Most of the examples are using the same fictive data for the rows (which you can see in the first example). Some examples use data from the real world, and some examples show randomized data with each page reload.

All columns and rows from original data

All the unmodified original data, presented with all the columns.

The same information as above, but slightly different column widths.

The same information as first example, with some added columns.

A larger randomized example.



Same as for simple table, and with the following additions.

Optional. Defines number of rows per page initially. Defaults to 5.


Same as for simple table.


Same as for simple table.

Note: The <nnm-pagination-table> component was initially created in April 2022.