Magento 2.0.18 is the final 2.0.x release. After March 2018, Magento 2.0.x will no longer receive security patches, quality fixes, or documentation updates.
To maintain your site's performance, security, and PCI compliance, upgrade to the latest version of Magento.

Pagination Component

The UI pagination component is a plugin for the listing component. Responsible for rendering pagination UI and applying pagination criteria to collection.

You can configure pagination in several ways:

  • Globally: using any module’s view/*/ui_component/etc/definition.xml file. All settings declared in this file are applied to all component’s instances.
  • Locally: using concrete component instance configuration, such as <Magento_Cms_module_dir>/view/adminhtml/ui_component/cms_page_listing.xml

To enable pagination for the listing component, the pagination component is declared as a child of the listing component in component instance configuration.



<listing xmlns:xsi="" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <container name="page_listing_top">
        <paging name="listing_paging">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="storageConfig" xsi:type="array">
                        <item name="provider" xsi:type="string">cms_block_listing.cms_block_listing.listing_top.bookmarks</item>
                        <item name="namespace" xsi:type="string">current.paging</item>
                    <item name="selectProvider" xsi:type="string">cms_block_listing.cms_block_listing.cms_block_columns.ids</item>

The configuration of the component can include:

  • storageConfig - storageConfig is a base component property. Here it is configured to take stored page sizes list from bookmarks

  • sizesConfig: configuration of the component that defines available page sizes. By default it is Magento_Ui/js/grid/paging/sizes.
    • minSize: minimum number of elements on a page, default: 1
    • maxSize: maximum number of elements on a page, default: 999
  • selectProvider: component with selections data.