0

I have created a ui component grid .

How to sorting the admin grid

<?xml version="1.0"?>
<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">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements_data_source</item>
            <item name="deps" xsi:type="string">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements_data_source</item>
        </item>
        <item name="spinner" xsi:type="string">xx_stockmovements_stock_columns</item>        
    </argument>
    <dataSource name="xx_stockmovements_stock_movements_data_source">
        <argument name="dataProvider" xsi:type="configurableObject">
            <argument name="class" xsi:type="string">XxStockMovementsGridDataProvider</argument>
            <argument name="name" xsi:type="string">xx_stockmovements_stock_movements_data_source</argument>
            <argument name="primaryFieldName" xsi:type="string">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">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>               
    <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">xx_stockmovements_stock_movements</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">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.xx_stockmovements_stock_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>
        <exportButton name="export_button">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="selectProvider" xsi:type="string">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.ids</item>
                </item>
            </argument>
        </exportButton>        
        <filters name="listing_filters">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="columnsProvider" xsi:type="string">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.xx_stockmovements_stock_columns</item>
                    <item name="storageConfig" xsi:type="array">
                        <item name="provider" xsi:type="string">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.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">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.listing_top.listing_filters</item>
                        <item name="imports" xsi:type="array">
                            <item name="visible" xsi:type="string">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.xx_stockmovements_stock_columns.${ $.index }:visible</item>
                        </item>
                    </item>
                </item>
                <item name="observers" xsi:type="array">
                    <item name="column" xsi:type="string">column</item>
                </item>
            </argument>
        </filters>       
        <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">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.listing_top.bookmarks</item>
                        <item name="namespace" xsi:type="string">current.paging</item>
                    </item>
                    <item name="selectProvider" xsi:type="string">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.xx_stockmovements_stock_columns.ids</item>
                </item>
            </argument>
        </paging>
    </container>
    <columns name="xx_stockmovements_stock_columns">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="storageConfig" xsi:type="array">
                    <item name="provider" xsi:type="string">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.listing_top.bookmarks</item>
                    <item name="namespace" xsi:type="string">current</item>
                </item>               
                <item name="childDefaults" xsi:type="array">
                    <item name="fieldAction" xsi:type="array">
                        <item name="provider" xsi:type="string">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.xx_stockmovements_stock_columns_editor</item>
                        <item name="target" xsi:type="string">startEdit</item>
                        <item name="params" xsi:type="array">
                            <item name="0" xsi:type="string">${ $.$data.rowIndex }</item>
                            <item name="1" xsi:type="boolean">true</item>
                        </item>
                    </item>
                    <item name="storageConfig" xsi:type="array">
                        <item name="provider" xsi:type="string">xx_stockmovements_stock_movements.xx_stockmovements_stock_movements.listing_top.bookmarks</item>
                        <item name="root" xsi:type="string">columns.${ $.index }</item>
                        <item name="namespace" xsi:type="string">current.${ $.storageConfig.root}</item>
                    </item>
                </item>
            </item>
        </argument>
         <column name="product_sku" class="Xx\StockMovements\Ui\Component\Listing\Columns\Product">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="bodyTmpl" xsi:type="string">ui/grid/cells/html</item>
                    <item name="filter" xsi:type="string">text</item>                   
                    <item name="label" xsi:type="string" translate="true">Sku</item>
                    <item name="sorting" xsi:type="string">desc</item>
                    <!--<item name="sortable" xsi:type="boolean">true</item>-->
                </item>
            </argument>
        </column>       
        <column name="qty">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">text</item>                   
                    <item name="label" xsi:type="string" translate="true">Qty</item>
                    <item name="sortable" xsi:type="string">asc</item>
                </item>
            </argument>
        </column>
        <column name="movement">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">text</item>                    
                    <item name="label" xsi:type="string" translate="true">Movement</item>
                    <item name="sortable" xsi:type="boolean">false</item>
                </item>
            </argument>
        </column>  
        <column name="is_in_stock">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Xx\StockMovements\Model\Column\InStock</item>
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">select</item>
                    <item name="label" translate="true" xsi:type="string">In Stock</item>
                    <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/select</item>
                    <item name="dataType" xsi:type="string">select</item> 
                    <item name="sortable" xsi:type="string">asc</item>          
                </item>
            </argument>
        </column>        
        <column name="message">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">text</item>                   
                    <item name="label" xsi:type="string" translate="true">Message</item>
                    <item name="sortable" xsi:type="string">asc</item>
                </item>
            </argument>
            <settings>
                <filter>textRange</filter>
                <label translate="true">Message</label>
                <sorting>asc</sorting>
            </settings>
        </column>

        <column name="user">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">text</item>                    
                    <item name="label" xsi:type="string" translate="true">User</item>
                    <item name="sortable" xsi:type="string">asc</item>
                </item>
            </argument>
        </column>
        <column name="created_at" class="Magento\Ui\Component\Listing\Columns\Date">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">dateRange</item>
                    <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/date</item>
                    <item name="dataType" xsi:type="string">date</item>
                    <item name="label" xsi:type="string" translate="true">Created At</item>
                    <item name="sortable" xsi:type="string">asc</item>
                </item>
            </argument>
        </column>   
    </columns>
</listing>

I also trying

<item name="sorting" xsi:type="string">desc</item>
<item name="sortable" xsi:type="boolean">true</item>

But its not working

  • Can you please upload your xml code of ui grid? – Rohan Hapani Mar 28 '18 at 12:59
  • @Mano M did you try my solution. if so, please accept the answer – theSeeker Nov 17 '19 at 8:44
0

I had exactly the same problem.

You first have to do your columns like this:

<column name="product_sku" class="Xx\StockMovements\Ui\Component\Listing\Columns\Product">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="bodyTmpl" xsi:type="string">ui/grid/cells/html</item>
            <item name="filter" xsi:type="string">text</item>                   
            <item name="label" xsi:type="string" translate="true">Sku</item>
            <item name="sorting" xsi:type="string">desc</item>
            <item name="sortable" xsi:type="boolean">true</item>
            <item name="sortOrder" xsi:type="number">1</item>
        </item>
    </argument>
</column>

Thereafter you need to go to your database table. search for table:

ui_bookmark

Search for the row that relates to your grid i.e:

product_attributes_listing

Delete the row and then:

php bin/magento cache:clean
php bin/magento cache:flush
0

Have You tried Like below code in Ui_component form file

<item name="sortOrder" xsi:type="number">10</item>
0

Try Below code

<column name="product_sku" class="Xx\StockMovements\Ui\Component\Listing\Columns\Product">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="bodyTmpl" xsi:type="string">ui/grid/cells/html</item>
            <item name="filter" xsi:type="string">text</item>                   
            <item name="label" xsi:type="string" translate="true">Sku</item>
            <item name="sorting" xsi:type="string">desc</item>
            <item name="sortable" xsi:type="boolean">true</item>
            <item name="sortOrder" xsi:type="number">1</item>
        </item>
    </argument>
</column>

Remove Cache

php bin/magento cache:clean
php bin/magento cache:flush

Hope it Helps.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.