0

In Magento 2.3.2, I have created a grid and form to add and edit.

In the grid column, I am able to display Customer Name instead of Customer Id with following code.

    <column name="customer_id" class="Meetanshi\HelloWorld\Ui\Component\Listing\Columns\Customername">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">text</item>
                <item name="editor" xsi:type="array">
                    <item name="editorType" xsi:type="string">text</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
                <item name="label" xsi:type="string" translate="true">Posted By Customer</item>
                <item name="sortOrder" xsi:type="number">20</item>
            </item>
        </argument>
    </column>

But I don’t know the way to display Customer Name instead of Customer Id in UI Component Form Field.

I have done following code to display Customer Id field in UI Component Form.

    <field name="customer_id">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string">Customer ID</item>
                <item name="visible" xsi:type="boolean">true</item>
                <item name="dataType" xsi:type="string">text</item>
                <item name="formElement" xsi:type="string">input</item>
                <item name="source" xsi:type="string">post</item>
                <item name="disabled" xsi:type="boolean">true</item>
                <item name="sortOrder" xsi:type="number">33</item>
            </item>
        </argument>
    </field>

Also I am facing problem while filtering data with Customer Name in grid. I am able to filter data with Customer Id but not with Customer Name.

2
  • from where you are getting this Customer_id?? – Waqar Ali Aug 2 '19 at 12:37
  • customer_id is available in our custom table. So based on that we want to display customer name. – Sagar Vasani Aug 2 '19 at 13:20
2

Create a file

Vendor\ModuleName\Model\DataProvider.php

use \Vendor\ModuleName\Model\ResourceModel\ModuleName\CollectionFactory;
/**
 * Class DataProvider
 */
class DataProvider extends \Magento\Ui\DataProvider\AbstractDataProvider
{
    /**
     * @var Array
     */
    protected $_loadedData;

    /**
     * @param string $name
     * @param string $primaryFieldName
     * @param string $requestFieldName
     * @param CollectionFactory $sliderCollectionFactory
     * @param array $meta
     * @param array $data
     */

    public function __construct(
        $name,
        $primaryFieldName,
        $requestFieldName,
        \Magento\Customer\Model\CustomerFactory $customerfactory,
        CollectionFactory $customCollectionFactory,
        array $meta = [],
        array $data = []
    ) {
        $this->customerfactory = $customerfactory;
        $this->collection   = $customCollectionFactory->create();
        parent::__construct($name, $primaryFieldName, $requestFieldName, $meta, $data);
    }

    /** Get All Loaded Data
     * @return loadedData
     */
    public function getData()
    {
        if (isset($this->_loadedData)) {
            return $this->_loadedData;
        }
        $acustomerModel = $this->customerfactory->create();
        $items             = $this->collection->getItems();
        foreach ($items as $item) {
            $data = $customerModel->load($item->getCustomerId());
            $this->_loadedData['customer_name'] = $data->getFirstName().' '.$data->getLastName();
        }
        return $this->_loadedData;
    }
}

Now in your UiComponent Grid Add this Column

<column name="customer_name" >
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">text</item>
                <item name="editor" xsi:type="array">
                    <item name="editorType" xsi:type="string">text</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
                <item name="label" xsi:type="string" translate="true">Posted By Customer</item>
                <item name="sortOrder" xsi:type="number">20</item>
            </item>
        </argument>
    </column>

Hope this will Help you

3
  • With the above solution, I will get Customer Name column in grid. But how can I get Customer Name in edit form on the bases of Customer Id? – Sagar Vasani Aug 2 '19 at 13:23
  • see the getData() function in dataProvider you will get answer – Waqar Ali Aug 2 '19 at 20:13
  • what i actually did is i get column customer_id from you collection foreach customer_id i got Full name from customer collection and returned customer_name loaded data to grid – Waqar Ali Aug 2 '19 at 20:16

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.