Magento2 Admin Grid – Pagination Issue

admingridmagento2paginationuicomponent

In magento admin, custom grid pagination is not working. I have 3 records in database, When I enter 2 records/page then next page button remains disabled and it will not show remaining 1 record.

This is Default setting when page is loaded.

This is the actual issue.
enter image description here

As soon as i type 2 and press enter it shows correct values until the grid is loading as in below image.But when grid loaded it will not show remaining record.
enter image description here

Below is the code of grid xml before columns

<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
<argument name="data" xsi:type="array">
    <item name="js_config" xsi:type="array">
        <item name="provider" xsi:type="string">productattachments_listing.productattachments_listing_data_source</item>
        <item name="deps" xsi:type="string">productattachments_listing.productattachments_listing_data_source</item>
    </item>
    <item name="spinner" xsi:type="string">productattachments_columns</item>
    <item name="buttons" xsi:type="array">
        <item name="add" xsi:type="array">
            <item name="name" xsi:type="string">add</item>
            <item name="label" xsi:type="string" translate="true">Add New File</item>
            <item name="class" xsi:type="string">primary</item>
            <item name="url" xsi:type="string">*/*/new</item>
        </item>
    </item>
</argument>
<dataSource name="productattachments_listing_data_source">
    <argument name="dataProvider" xsi:type="configurableObject">
        <argument name="class" xsi:type="string">ProductattachmentsGridDataProvider</argument>
        <argument name="name" xsi:type="string">productattachments_listing_data_source</argument>
        <argument name="primaryFieldName" xsi:type="string">productattachments_id</argument>
        <argument name="requestFieldName" xsi:type="string">id</argument>
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="update_url" xsi:type="url" path="mui/index/render"/>
            </item>
        </argument>
    </argument>
    <argument name="data" xsi:type="array">
        <item name="js_config" xsi:type="array">
            <item name="component" xsi:type="string">Magento_Ui/js/grid/provider</item>
        </item>
    </argument>
</dataSource>
<container name="listing_top">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="template" xsi:type="string">ui/grid/toolbar</item>
            <item name="stickyTmpl" xsi:type="string">ui/grid/sticky/toolbar</item>
        </item>
    </argument>
    <bookmark name="bookmarks">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="storageConfig" xsi:type="array">
                    <item name="namespace" xsi:type="string">productattachments_listing</item>
                </item>
            </item>
        </argument>
    </bookmark>
    <component name="columns_controls">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="columnsData" xsi:type="array">
                    <item name="provider" xsi:type="string">productattachments_listing.productattachments_listing.productattachments_columns</item>
                </item>
                <item name="component" xsi:type="string">Magento_Ui/js/grid/controls/columns</item>
                <item name="displayArea" xsi:type="string">dataGridActions</item>
            </item>
        </argument>
    </component>
    <filters name="listing_filters">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="columnsProvider" xsi:type="string">productattachments_listing.productattachments_listing.productattachments_columns</item>
                <item name="storageConfig" xsi:type="array">
                    <item name="provider" xsi:type="string">productattachments_listing.productattachments_listing.listing_top.bookmarks</item>
                    <item name="namespace" xsi:type="string">current.filters</item>
                </item>
                <item name="templates" xsi:type="array">
                    <item name="filters" xsi:type="array">
                        <item name="select" xsi:type="array">
                            <item name="component" xsi:type="string">Magento_Ui/js/form/element/ui-select</item>
                            <item name="template" xsi:type="string">ui/grid/filters/elements/ui-select</item>
                        </item>
                    </item>
                </item>
                <item name="childDefaults" xsi:type="array">
                    <item name="provider" xsi:type="string">productattachments_listing.productattachments_listing.listing_top.listing_filters</item>
                    <item name="imports" xsi:type="array">
                        <item name="visible" xsi:type="string">productattachments_listing.productattachments_listing.productattachments_columns.${ $.index }:visible</item>
                    </item>
                </item>
            </item>
            <item name="observers" xsi:type="array">
                <item name="column" xsi:type="string">column</item>
            </item>
        </argument>
        <filterSelect name="store_id">
            <argument name="optionsProvider" xsi:type="configurableObject">
                <argument name="class" xsi:type="string">Magento\Cms\Ui\Component\Listing\Column\Cms\Options</argument>
            </argument>
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataScope" xsi:type="string">store_id</item>
                    <item name="label" xsi:type="string" translate="true">Store View</item>
                    <item name="captionValue" xsi:type="string">0</item>
                </item>
            </argument>
        </filterSelect>
    </filters>
    <massaction name="listing_massaction">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="selectProvider" xsi:type="string">productattachments_listing.productattachments_listing.productattachments_columns.ids</item>
                <item name="indexField" xsi:type="string">productattachments_id</item>
            </item>
        </argument>
        <action name="delete">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="type" xsi:type="string">delete</item>
                    <item name="label" xsi:type="string" translate="true">Delete</item>
                    <item name="url" xsi:type="url" path="productattachmentsadmin/productattachments/massDelete"/>
                    <item name="confirm" xsi:type="array">
                        <item name="title" xsi:type="string" translate="true">Delete items</item>
                        <item name="message" xsi:type="string" translate="true">Are you sure you wan't to delete selected items?</item>
                    </item>
                </item>
            </argument>
        </action>
        <action name="disable">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="type" xsi:type="string">disable</item>
                    <item name="label" xsi:type="string" translate="true">Disable</item>
                    <item name="url" xsi:type="url" path="productattachmentsadmin/productattachments/massDisable"/>
                </item>
            </argument>
        </action>
        <action name="enable">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="type" xsi:type="string">enable</item>
                    <item name="label" xsi:type="string" translate="true">Enable</item>
                    <item name="url" xsi:type="url" path="productattachmentsadmin/productattachments/massEnable"/>
                </item>
            </argument>
        </action>
        <action name="edit">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="type" xsi:type="string">edit</item>
                    <item name="label" xsi:type="string" translate="true">Edit</item>
                    <item name="callback" xsi:type="array">
                        <item name="provider" xsi:type="string">productattachments_listing.productattachments_listing.productattachments_columns_editor</item>
                        <item name="target" xsi:type="string">editSelected</item>
                    </item>
                </item>
            </argument>
        </action>
    </massaction>
    <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">productattachments_listing.productattachments_listing.listing_top.bookmarks</item>
                    <item name="namespace" xsi:type="string">current.paging</item>
                </item>
                <item name="selectProvider" xsi:type="string">productattachments_listing.productattachments_listing.productattachments_columns.ids</item>
            </item>
        </argument>
    </paging>
</container>

Best Answer

In the:

<dataSource name="productattachments_listing_data_source">

You should add these lines to dataProvider:

<item name="storageConfig" xsi:type="array">
    <item name="indexField" xsi:type="string">YOUR_INDEX_FIELD</item>
</item>

So in a result it will look like this:

<dataSource name="productattachments_listing_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
    <argument name="class" xsi:type="string">ProductattachmentsGridDataProvider</argument>
    <argument name="name" xsi:type="string">productattachments_listing_data_source</argument>
    <argument name="primaryFieldName" xsi:type="string">productattachments_id</argument>
    <argument name="requestFieldName" xsi:type="string">id</argument>
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="update_url" xsi:type="url" path="mui/index/render"/>
            <item name="storageConfig" xsi:type="array">
                <item name="indexField" xsi:type="string"> productattachments_id</item>
            </item>
        </item>
    </argument>
</argument>
<argument name="data" xsi:type="array">
    <item name="js_config" xsi:type="array">
        <item name="component" xsi:type="string">Magento_Ui/js/grid/provider</item>
    </item>
</argument>
</dataSource>

Also, you forget to close "listing" tag

Related Topic