कैसे ui घटक का उपयोग किए बिना Magento 2 व्यवस्थापक ग्रिड फिल्टर की तारीख प्रारूप बदलने के लिए?


14

नीचे है some_grid_block.xml,

मैं कैलेंडर फ़िल्टर में दिनांक प्रारूप कैसे बदल सकता हूं।

 <?xml version="1.0"?>
    <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="adminhtml.qrcode.grid.container">
            <block class="Oneteam\Qrcode\Block\Grid" name="adminhtml.qrcode.grid" as="grid">
                <arguments>
                    <argument name="id" xsi:type="string">QrcodeGrid</argument>
                    <argument name="dataSource" xsi:type="object">Oneteam\Qrcode\Model\ResourceModel\Qrcode\Collection</argument>
                    <argument name="default_sort" xsi:type="string">qr_id</argument>
                    <argument name="default_dir" xsi:type="string">desc</argument>
                </arguments>
                <block class="Magento\Backend\Block\Widget\Grid\Column\Filter\Date">
                    <filterRange name="created_at"  class="Magento\Backend\Block\Widget\Grid\Column\Filter\Date">
                        <argument name="data" xsi:type="array">
                            <item name="config" xsi:type="array">
                                <item name="dataScope" xsi:type="string">created_at</item>
                                <item name="label" xsi:type="string" translate="true">Created</item>
                            </item>
                        </argument>
                        <filterDate name="from">
                            <argument name="data" xsi:type="array">
                                <item name="config" xsi:type="array">
                                    <item name="dataScope" xsi:type="string">from</item>
                                    <item name="label" xsi:type="string" translate="true">From</item>
                                    <item name="placeholder" xsi:type="string" translate="true">From</item>
                                    <item name="dateFormat" xsi:type="string" translate="true">dd/MM/YYYY</item>
                                </item>
                            </argument>
                        </filterDate>
                        <filterDate name="to">
                            <argument name="data" xsi:type="array">
                                <item name="config" xsi:type="array">
                                    <item name="dataScope" xsi:type="string">to</item>
                                    <item name="label" xsi:type="string" translate="true">To</item>
                                    <item name="placeholder" xsi:type="string" translate="true">To</item>
                                    <item name="dateFormat" xsi:type="string" translate="true">dd/MM/YYYY</item>
                                </item>
                            </argument>
                        </filterDate>
                    </filterRange>
                </block>
                <block class="Magento\Backend\Block\Widget\Grid\ColumnSet" as="grid.columnSet" name="qrcode.grid.columnSet">
                    <arguments>
                        <argument name="id" xsi:type="string">QrcodeGrid</argument>
                        <argument name="rowUrl" xsi:type="array">
                            <item name="generatorClass" xsi:type="string">Magento\Backend\Model\Widget\Grid\Row\UrlGenerator</item>
                            <item name="path" xsi:type="string">*/*/edit</item>
                            <item name="extraParamsTemplate" xsi:type="array">
                                <item name="qr_id" xsi:type="string">getId</item>
                            </item>
                        </argument>
                    </arguments>
                    <block class="Magento\Backend\Block\Widget\Grid\Column" as="qr_id">
                        <arguments>
                            <argument name="header" xsi:type="string" translate="true">ID</argument>
                            <argument name="sortable" xsi:type="string">true</argument>
                            <argument name="index" xsi:type="string">qr_id</argument>
                            <argument name="column_css_class" xsi:type="string">col-id</argument>
                            <argument name="header_css_class" xsi:type="string">col-id</argument>
                        </arguments>
                    </block>
                    <block class="Magento\Backend\Block\Widget\Grid\Column" as="qr_code">
                        <arguments>
                            <argument name="header" xsi:type="string" translate="true">QR Code</argument>
                            <argument name="type" xsi:type="string">text</argument>
                            <argument name="index" xsi:type="string">qr_code</argument>
                            <argument name="escape" xsi:type="string">1</argument>
                            <argument name="column_css_class" xsi:type="string">col-name</argument>
                            <argument name="header_css_class" xsi:type="string">col-name</argument>
                        </arguments>
                    </block>

                    <block class="Magento\Backend\Block\Widget\Grid\Column" as="qr_status">
                        <arguments>
                            <argument name="header" xsi:type="string" translate="true">QR Code Status</argument>
                            <argument name="type" xsi:type="string">text</argument>
                            <argument name="index" xsi:type="string">qr_status</argument>
                            <argument name="escape" xsi:type="string">1</argument>
                            <argument name="column_css_class" xsi:type="string">col-name</argument>
                            <argument name="header_css_class" xsi:type="string">col-name</argument>
                        </arguments>
                    </block>
            <block class="Magento\Backend\Block\Widget\Grid\Column" as="binggz_value">
                        <arguments>
                            <argument name="header" xsi:type="string" translate="true">Number of Binggz</argument>
                            <argument name="type" xsi:type="string">text</argument>
                            <argument name="index" xsi:type="string">binggz_value</argument>
                            <argument name="renderer" xsi:type="string">Oneteam\Qrcode\Block\Widget\Grid\Column\Renderer\Binggz</argument>
                            <argument name="escape" xsi:type="string">1</argument>
                            <argument name="column_css_class" xsi:type="string">col-name</argument>
                            <argument name="header_css_class" xsi:type="string">col-name</argument>
                        </arguments>
                    </block>

                    <block class="Magento\Backend\Block\Widget\Grid\Column" as="customer_username">
                        <arguments>
                            <argument name="header" xsi:type="string" translate="true">Customer Name</argument>
                            <argument name="type" xsi:type="string">text</argument>
                            <argument name="index" xsi:type="string">customer_username</argument>
                            <argument name="escape" xsi:type="string">1</argument>
                            <argument name="column_css_class" xsi:type="string">col-name</argument>
                            <argument name="header_css_class" xsi:type="string">col-name</argument>
                        </arguments>
                    </block>
                    <block class="Magento\Backend\Block\Widget\Grid\Column" as="created_date">
                        <arguments>
                            <argument name="header" xsi:type="string" translate="true">Created Date</argument>
                            <argument name="type" xsi:type="string">date</argument>
                            <argument name="index" xsi:type="string">created_date</argument>
                            <argument name="format" xsi:type="string" translate="true">dd-MM-YYYY HH:MM:SS</argument>
                            <argument name="column_css_class" xsi:type="string">col-name</argument>
                            <argument name="header_css_class" xsi:type="string">col-name</argument>
                        </arguments>
                    </block>

                </block>
            </block>
        </referenceBlock>
    </body>
    </page>

जवाबों:


14

XML कॉन्फ़िगरेशन निम्नानुसार है जो आपको काम करना चाहिए:

<filterRange name="created_at" class="Magento\Backend\Block\Widget\Grid\Column\Filter\Date">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="templates" xsi:type="array">
                <item name="date" xsi:type="array">
                    <item name="options" xsi:type="array">
                        <item name="dateFormat" xsi:type="string">dd/MM/y</item>
                    </item>
                    <item name="outputDateFormat" xsi:type="string">dd/MM/y</item>
                    <item name="inputDateFormat" xsi:type="string">dd/MM/y</item>
                </item>
            </item>
        </item>
    </argument>
</filterRange>

उपरोक्त विन्यास पर कुछ जानकारी:

  • dateFormat (में options ) दिनांक पिकर से फ़िल्टर फ़ील्ड में इनपुट करने वाला प्रारूप है।
  • inputDateFormat सर्वर से आने वाली तारीख का प्रारूप है
  • outputDateFormat सर्वर को भेजी जाने वाली तारीख का प्रारूप है।

दिनांक कैसे स्वरूपित होती है, इसके आधार पर, आपको आवश्यकता नहीं हो सकती है inputDateFormat, हालाँकि, मुझे यकीन नहीं है कि यह होने पर दुख होगा। यदि आप सेट करते हैं dateFormat, तो आपको संभवतः सेट करना होगाinputDateFormat फिल्टर को जिस तरह से हैंडल किया जाता है, उसके कारण ।

इसके अलावा, वर्ष के yबजाय इसके उपयोग पर ध्यान दें YYYY। दिनांक घटक ICU दिनांक स्वरूप का उपयोग करता है ।


पृष्ठभूमि

यदि आप रुचि रखते हैं कि नेस्टेड कॉन्फ़िगरेशन वास्तव में उस स्थान पर कैसे जाता है जहां इसे जाने की आवश्यकता है, तो ये चरण हैं। निम्नलिखित सभी अंदर के मूल्यों पर लागू होते हैंdefaults: {} जावास्क्रिप्ट कक्षा ऑब्जेक्ट के । फ़ाइल पथ निम्न के सापेक्ष हैं:/vendor/magento/module-ui/view/base/web/js/

  1. में grid/filters/range.js एक है templatesविकल्प।
  2. अंदर templatesहैdate जिसमें date.jsफार्म तत्व के लिए कॉन्फ़िगरेशन है ।
  3. form/element/date.jsवर्ग चेकों यह optionsदेखने के लिए मूल्यdateFormat निर्धारित है।
  4. outputDateFormatऔर inputDateFormatदोनों का उपयोग date.jsतत्व रूप में किया जाता है ।

अंत में, जब आपने उल्लेख किया कि आप UI घटक का उपयोग नहीं करना चाहते हैं, तो मैं यह मान रहा हूं कि आपका लक्ष्य जावास्क्रिप्ट क्लासेस या उस के कुछ संस्करण को बढ़ाने से बचना था। filterRangeएक्सएमएल नोड एक यूआई घटक के लिए विन्यास है, तो यह वास्तव में एक यूआई घटक का उपयोग करता है।


0

दिनांक स्वरूप बदलने के लिए इस चरण का पालन करें

ग्रिड / फिल्टर / रेंज.जज में एक टेम्पलेट विकल्प होता है। इनसाइड टेम्प्लेट वह तारीख होती है, जिसमें date.js फॉर्म एलिमेंट के लिए कॉन्फ़िगरेशन होता है। प्रपत्र / तत्व / date.js वर्ग की जाँच करता है कि यह देखने के लिए विकल्प है कि क्या dateFormat सेट है। outputDateFormat और inputDateFormat दोनों का उपयोग date.js फॉर्म एलिमेंट में किया जाता है।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.