4

I needed a custom column to be displayed in order Grid (Yes/No) Type. So I followed below steps:

  1. I created a new column in table "sales_order_grid"

    $installer->getConnection()->addColumn(
            $setup->getTable('sales_order_grid'), 'is_prebook', [
        'type' => \Magento\Framework\DB\Ddl\Table::TYPE_INTEGER,
        'length' => 11,
        'default' => '0',
        'nullable' => true,
        'comment' => 'Prebook'
            ]
    );
    
  2. Then created sales_order_grid.xml app/code/Akhil/Prebook/view/adminhtml/ui_component/sales_order_grid.xml
<?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">
<columns name="sales_order_columns">
    <column name="is_prebook">
        <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="label" xsi:type="string" translate="true">Prebook</item>
                </item>            
        </argument>
    </column>
</columns>
</listing>

Column added successfully but value showing '0' How to display as 1=>Yes & 0=> No

Tried below code. Is this should make sense here?

<item name="dataType" xsi:type="string">select</item>
<item name="options" xsi:type="object">Akhil\Prebook\Model\Source\Prebookstatus</item>

File: Akhil\Prebook\Model\Source\Prebookstatus

class Prebookstatus implements \Magento\Framework\Option\ArrayInterface {

    /**
     * Retrieve status options array.
     *
     * @return array
     */
    public function toOptionArray() {
        return [
            ['value' => 0, 'label' => __('No')],
            ['value' => 1, 'label' => __('Yes')]
        ];
    }

}
  • You can write renderer for same and add that render class in xml – Pramod Kharade Dec 20 '17 at 8:42
  • Yeah that also should work. But got other simple solution after digging core. I will add that in answer. – Akhil Gupta Dec 20 '17 at 9:45
6

After some digging found the solution. What i need was just to make some changes in ui_comonent XML file:

I changed this:

<?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">
<columns name="sales_order_columns">
    <column name="is_prebook">
        <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="label" xsi:type="string" translate="true">Prebook</item>
                </item>            
        </argument>
    </column>
</columns>
</listing>

To:

<?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">
    <columns name="sales_order_columns">
        <column name="is_prebook">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Akhil\Prebook\Model\Source\Prebookstatus</item>
                <item name="config" xsi:type="array">                    
                    <item name="filter" xsi:type="string">select</item>
                    <item name="bodyTmpl" xsi:type="string">ui/grid/cells/html</item>
                    <item name="sortable" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">select</item>
                    <item name="sortOrder" xsi:type="number">40</item>
                    <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/select</item>
                    <item name="editor" xsi:type="string">select</item>
                    <item name="label" xsi:type="string" translate="true">Prebook</item>
                </item>
            </argument>
        </column>
    </columns>
</listing>
| improve this answer | |
  • Awesome! This has saved my day. :) – Amit Merchant Dec 21 '18 at 5:18
2
   <column name="is_prebook" component="Magento_Ui/js/grid/columns/select" sortOrder="80">
        <settings>
            <addField>true</addField>
            <options class="YOUR_VENDOR\YOUR_MODULE\Model\Source\PrebookStatus"/>
            <filter>select</filter>
            <dataType>select</dataType>
            <label translate="true">PrebookStatus</label>
        </settings>
    </column>

Now you need to create source class(Which must implement Magento\Framework\Data\OptionSourceInterface) for this which defined <option>

<?php

namespace YOUR_VENDOR\YOUR_MODULE\Model\Source;

use Magento\Framework\Data\OptionSourceInterface;

/**
 * Class PrebookStatus
 */
class PrebookStatus implements OptionSourceInterface
{

    const PRE_BOOK_YES=1;
    const PRE_BOOK_NO=0;

    public static function getOptionArray()
    {
        return [
            self::PRE_BOOK_YES => __('Yes'),
            self::PRE_BOOK_NO => __('No')
        ];
    }

    /**
     * Get options
     *
     * @return array
     */
    public function toOptionArray()
    {
        $res = [];
        foreach (self::getOptionArray() as $index => $value) {
            $res[] = ['value' => $index, 'label' => $value];
        }
        return $res;
    }
}
| improve this answer | |
  • Hi Keyur, How the <settings> tag will work here. Its throwing error as: Element 'settings': This element is not expected. Anyways i got the solution and posted here. Thanks – Akhil Gupta Dec 20 '17 at 11:20
  • 1
    This code will work only on Magento 2.2 or higher – Andrey Konosov Dec 21 '17 at 10:26
  • Yes, I am using 2.2 so, thanks for pointing :) @AndreyKonosov – Keyur Shah Dec 21 '17 at 10:54

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.