Magento – Magento 2 adminhtml custom column sorting ascending and descending

admincolumnmagento2sorting

I made a custom column in sales_order_invoice_grid to display some additional data. This works fine but when clicking on the given column it does not react on any sorting mechanism like descending and ascending

Here is what I got

sales_order_invoice_grid

 <column name="order_state" class="Foobar\InvoiceOrderStatus\Ui\Component\Listing\Column\Status">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">textRange</item>
                    <item name="label" xsi:type="string" translate="true">Order Status</item>
                </item>
            </argument>
        </column>

The corresponding class

class Status extends Column
{

    /**
     * Prepare Data Source
     *
     * @param array $dataSource
     * @return array
     */
    public function prepareDataSource(array $dataSource)
    {
        $objectManager = \Magento\Framework\App\ObjectManager::getInstance();

        if (isset($dataSource['data']['items'])) {
            foreach ($dataSource['data']['items'] as &$item) {

                $orderId = $item["order_id"];
                if (empty($orderId)) {
                    $item[$this->getData('name')] = "unkown";
                    continue;
                }

                /** @var \Magento\Sales\Model\OrderRepository $orderRepo */
                $orderRepo = $objectManager->get('Magento\Sales\Model\OrderRepository');
                /** @var \Magento\Sales\Model\Order $order */
                $order = $orderRepo->get($orderId);
                $item[$this->getData('name')] = $order->getStatus();
            }
        }

        return $dataSource;
    }


}

How can I apply descending / ascending sorting to my custom column?

Best Answer

<column name="order_state" class="Foobar\InvoiceOrderStatus\Ui\Component\Listing\Column\Status">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="filter" xsi:type="string">textRange</item>
            <item name="sorting" xsi:type="string">desc</item>
            <item name="label" xsi:type="string" translate="true">Order Status</item>
        </item>
    </argument>
</column>

You just need to add asc or desc sorting tab

<item name="sorting" xsi:type="string">desc</item>
Related Topic