0

I'm trying to format the display and also the datepicker value when selecting the date in Filter for my custom grid. Now the display works fine the only problem is when I filter it, it doesn't work as expected. Example I selecte a date from Feb 18, 2021 to March 17, 2021. Now in the filter it works great as it's displaying as 18/02/2021 and 17/03/2021. But the result is different. It seems Magento is interpreting in as 02/18/2021 and 03/17/2021 hence the result is wrong. Now I have this in my xml

<column name="date_paid" class="Magento\Ui\Component\Listing\Columns\Date" component="Magento_Ui/js/grid/columns/date">
  <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
      <item name="filter" xsi:type="string">dateRange</item>
      <item name="sortOrder" xsi:type="number">5</item>
      <item name="dateFormat" xsi:type="string">d/MM/Y</item>
    </item>
  </argument>
  <settings>
        <label translate="true">Date Paid</label>              
        <sortable>false</sortable>
        <draggable>false</draggable>
        <filter>dateRange</filter>
        <dataType>date</dataType>        
  </settings>
</column> 

And I also tried this

<column name="date_paid" class="Magento\Ui\Component\Listing\Columns\Date" component="Magento_Ui/js/grid/columns/date">
  <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
      <item name="filter" xsi:type="string">dateRange</item>
      <item name="sortOrder" xsi:type="number">5</item>
    </item>
  </argument>
  <settings>
        <label translate="true">Date Paid</label>              
        <sortable>false</sortable>
        <draggable>false</draggable>
        <filter>dateRange</filter>
        <dataType>date</dataType>
        <dateFormat>d/MM/Y</dateFormat>            
  </settings>
</column> 

But all of this is producing a wrong result. Now when I try to remove the parameter dateFormat the result is correct.

How do I tell Magento to only format the display but the way it submit should be like the default? I was thinking that will be the only way to achieve what I want. I just want it to display in a d/MM/Y format

0

Try using <dateFormat>d/MMM/YYYY</dateFormat> instead of <dateFormat>d/MM/Y</dateFormat> for more details check date.js this file.

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.