Grid Pagination
Custom Vaadin 14+ Grid component with pagination feature enabled
Editorial note: This add-on is no more actively developed. As an alternative you can check for example PagingGrid component in Viritin add-on or BeanTable.
Adding pagination feature to the Vaadin 14+ Grid component.
Component originally created by Klaudeta Mertiku, now in maintenance mode by Team Parttio.
Sample code
PaginatedGrid<Address> grid = new PaginatedGrid<>();
grid.addColumn(Address::getId).setHeader("ID");
grid.addColumn(Address::getCountry).setHeader("Country").setSortable(true);
grid.addColumn(Address::getState).setHeader("State").setSortable(true);
grid.addColumn(Address::getName).setHeader("Name").setSortable(true);
grid.addColumn(Address::getAddress).setHeader("Address").setSortable(true);
grid.setItems(dataProvider.getItems());
// Sets the max number of items to be rendered on the grid for each page
grid.setPageSize(16);
// Sets how many pages should be visible on the pagination before and/or after the current selected page
grid.setPaginatorSize(5);
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
- Released
- 2025-03-10
- Maturity
- EXPERIMENTAL
- License
- Apache License 2.0
Compatibility
- Framework
- Vaadin 24
- Vaadin 23+ in 3.0.0
- Vaadin 14 in 2.0.10
- Vaadin 14+ in 2.0.9
- Vaadin 13 in 1.0.1
- Vaadin 12 in 1.0.1
- Vaadin 11+ in 1.0.0
- Vaadin 11 in 1.0.1
- Vaadin 10+ in 1.0.0
- Vaadin 10 in 1.0.1
- Browser
- Browser Independent
Grid Pagination - Vaadin Add-on Directory
Custom Vaadin 14+ Grid component with pagination feature enabled
Online Demo
Grid Pagination version 1.0.0
Custom Vaadin 10 Grid with pagination feature
Grid Pagination version 1.0.1
1. Fixing a NPE exception being thrown when grid items is set after grid being attached.
2. Adding PageChangeListener to the PaginatedGrid
Grid Pagination version 2.0.0
Adaption of GridPagination to be used with Vaadin 14.x with npm mode enabled.
The add-on is using now the [lit-pagination](https://www.npmjs.com/package/lit-pagination) web-component which is published as a npm package.
Grid Pagination version 1.0.2
- Support for Vaadin 14+ (compatibility mode)
- Initialize an empty DataProvider to fix NPE when component is attached before an explicit DataProvider is set
Grid Pagination version 1.0.3
Change access modifier of addPageChangeListener to public
Grid Pagination version 2.0.1
Change access modifier of listener to public
Grid Pagination version 2.0.3
- integrate lit-pagination.js inside this add-on here,
- api to set pagination text from the server side component,
- upgrade vaadin version to V14.1.25
Grid Pagination version 2.0.4
Excluding the `META-INF/VAADIN/config/flow-build-info.json` file from the add-on.
Grid Pagination version 2.0.5
Get rid of `[WARNING] Use the './' prefix for files in JAR files: 'lit-pagination.js', please update your component.`
Grid Pagination version 2.0.6
- Sorting feature using the grid columns
- Text color of the paginator to be conform to the theme and variant set on the app
Grid Pagination version 2.0.7
New feature to set the location of the pagination element relative to the grid component.
Options are TOP and BOTTOM.
Grid Pagination version 2.0.8
- add constructor with bean class type as parameter
- add the possibility to place the pagination inside a given container (from PR #4)
Grid Pagination version 2.0.9
Add method to change visibility of pagination.
Grid Pagination version 2.0.10
- Delete banner.txt
- Upgrade Vaadin version to 14.4.2
Grid Pagination version 3.0.0
Support for Vaadin 23 and forward
Grid Pagination version 4.0.0
Support for Vaadin 24