0

I want format start date and end date to dd-mm-y, offer price to xxx,xxx.xx

My column

<column name="start_date">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">dateRange</item>
                <item name="dateFormat" xsi:type="string">dd-MM-y</item>
                <item name="sorting" xsi:type="string">asc</item>
                <item name="label" xsi:type="string" translate="true">Start Date</item>
                <item name="sortOrder" xsi:type="number">1</item>
            </item>
        </argument>
    </column>
    <column name="end_date">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">dateRange</item>
                <item name="dateFormat" xsi:type="string">dd-MM-Y</item>
                <item name="sorting" xsi:type="string">asc</item>
                <item name="label" xsi:type="string" translate="true">End Date</item>
                <item name="sortOrder" xsi:type="number">1</item>
            </item>
        </argument>
    </column>
    <column name="offer_price">
        <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">asc</item>
                <item name="label" xsi:type="string" translate="true">Offer Price</item>
                <item name="sortOrder" xsi:type="number">1</item>
            </item>
        </argument>
    </column>

Please help me.

1 Answer 1

2

You can add below lines in your ui_component file

<column name="start_date" 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="dateFormat" xsi:type="string">dd-MM-y</item>
            <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/date</item>
            <item name="label" xsi:type="string" translate="true">Start Date</item>
            <item name="sortOrder" xsi:type="number">1</item>
        </item>
    </argument>
</column>
<column name="end_date" 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="dateFormat" xsi:type="string">dd-MM-Y</item>
            <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/date</item>
            <item name="label" xsi:type="string" translate="true">End Date</item>
            <item name="sortOrder" xsi:type="number">2</item>
        </item>
    </argument>
</column>
<column name="offer_price" class="Vendor\Module\Ui\Component\Listing\Columns\Price">
    <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">Offer Price</item>
            <item name="sortOrder" xsi:type="number">3</item>
        </item>
    </argument>
</column>

And now you need to create one Price.php file here

app/code/Vendor/Module/Ui/Component/Listing/Columns/Price.php

Content for this file is..

<?php

namespace Vendor\Module\Ui\Component\Listing\Columns;

use Magento\Ui\Component\Listing\Columns\Column;

class Price extends Column
{

    public function prepareDataSource(array $dataSource)
    {
        if (isset($dataSource['data']['items'])) {
            foreach ($dataSource['data']['items'] as & $item) {
                if ($this->getData('name') == 'offer_price') {
                   $item[$this->getData('name')] = //You can add your specific price format here..
                }
            }
        }

        return $dataSource;
    }
}

Hope this will help you!

1
  • Did you tried this ? Commented Nov 13, 2019 at 12:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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