Generic paging component

[Flaurite]

Description

There is a RowCount component built-in tables/dataGrid. It has the following limitations:

• it does not contain rows per page setting (currently in filter).
• it cannot be used outside of tables.
• it can be more customizable and contain page buttons.

---

Changes

RowsCount is deprecated and moved to the compatibility module.

Added two new components:

• Pagination
• SimplePagination

---

SimplePagination

It has a simple view with a count of rows and navigation buttons.

It can be used as a separate component in the layout:

and as part of Table, GroupTable, TreeTable, DataGrid, and TreeDataGrid:

Data binding

To make SimplePagination work we need to define loader or container. In the screen descriptor we have the following options:

• use loader:

  <simplePagination>
      <loaderProvider loaderId="usersDl"/>
  </simplePagination>
  

• use data container:

  <simplePagination>
      <containerProvider dataContainer="usersDc"/>
  </simplePagination>
  

Note, we don't need to use loader and container providers when SimplePagination is used in Table, DataGrid, and so on, as it will get data-binding from the table.

Number of items per page

SimplePagination has a special ComboBox with options that can be used as a number of items per page. To make it visible, we should use the following attribute:

• itemsPerPageVisible="true"
  

By default options for this ComboBox are get from application property: jmix.ui.paginationItemsPerPageOptions. For specific SimplePagination we can configure custom list of options using the property:

• itemsPerPageOptions - it takes a string with numbers separated by comma. For instance: itemsPerPageOptions="10, 15, 20, 30, 50".
  Note, if value is greater than entity's max fetch size ( ui.jmix.entityMaxFetchSize.my_entity_name) it will be replaced by it.
  

To set a default value for options, we should use the property:

• itemsPerPageDefaultValue - sets default value from options. For instance, itemsPerPageDefaultValue="15".

Note, if itemsPerPageVisible is disabled component will try to get maximum result from the loader.

SimplePagination specific API

SimplePagination shows the current items count and the label with a question mark:

If you click on it, the component will load the total count of items. For managing this label there is the following property:

• autoLoad

When the autoLoad is disabled the component doesn't know the total count of items and shows a question mark. When it's enabled the component makes a query to get the total count of items and shows it. The default value is false.

---

Pagination

Pagination contains page numbers that enable the user to select a specific page. Pagination cannot be used in Table, DataGrid, etc.

Data-binding

The component has the same data binding rules as SimplePagination:

• loader:

  <pagination>
      <loaderProvider loaderId="usersDl"/>
  </pagination>
  

• data container:

  <pagination>
      <containerProvider dataContainer="usersDc"/>
  </pagination>
  

Number of items per page

The same as SimplePagination:

• itemsPerPageVisible;
• itemsPerPageOptions;
• itemsPerPageDefaultValue;
  

Specific Pagination API

Pagination component provides the ability to change the number of maximum visible pages:

• maxVisiblePages - is a number of pages that are visible at once. The default value is 5. For instance, if we set maxVisiblePages="3", we will see only 3 pages:
  

Java API
Pagination provides PageChangeEvent that is fired when the user selects another page or clicks on navigation buttons (next, previous, etc):

addPageChangeListener(Consumer<PageChangeEvent> listener);

---

General Java API

Both Pagination and SimplePagination have the following events:

• BeforeRefreshEvent - the event that is fired before refreshing the data when the user clicks next, previous, etc. It provides ability to prevent the data container refresh;

  addBeforeRefreshListener(Consumer<BeforeRefreshEvent> listener);
  

• AfterRefreshEvent - the event that is fired after data refresh;

  addAfterRefreshListener(Consumer<AfterRefreshEvent> listener);
  

[alexbudarov]

Studio ticket: JST-137

[glebfox]

@Flaurite add detailed description (pre docs)