Magento 2 Add Customer Fullname on Admin Grid

While developing any custom extension most of the time we need to add some features which depend on the customer and in that case, we'll store the customer id in our custom table and want to display the customer's full name in the admin grid. So, in this article, we'll show you how to display the customer's full name on the admin UI grid.

Before we start I assume, you have already created a custom grid collection.

Now, you just need to add _initSelect() and addFieldToFilter functions in your collection class file.

saveCopyzoom_out_map
protected function _initSelect()
{
    parent::_initSelect();
    $this->getSelect()->join(
        ['ce' => $this->getConnection()->getTableName('customer_entity')],
        'main_table.customer_id = ce.entity_id',
        [
            'customer_name' => 'CONCAT(`ce`.`firstname`, " ", `ce`.`lastname`)'
        ]
    );
    return $this;
}

In the above code you can see we've get customer firstname and lastname from the customer_entity table usgin join.

saveCopyzoom_out_map
public function addFieldToFilter($field, $condition = null)
{
    if ($field === 'customer_name') {
        $customerTable = $this->getConnection()->getTableName('customer_entity');
        $this->getSelect()->joinLeft(
        ['cust' => $customerTable],
            'main_table.customer_id = cust.entity_id',
        []
        );
        $conditionSql = $this->_getConditionSql(
            'CONCAT(`cust`.`firstname`, " ", `cust`.`lastname`)',
            $condition
        );
        $this->getSelect()->where($conditionSql);
        return $this;
    }
    return parent::addFieldToFilter($field, $condition);
}

We've added addFieldToFilter function with join just because of filter.

Now, you just need to add customer_name as an column in your grid. Review below example code for your reference.

saveCopyzoom_out_map
<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="dataType" xsi:type="string">select</item>
            <item name="label" xsi:type="string" translate="true">Customer Name</item>
        </item>
    </argument>
</column>

Open Command line in folder root of magento and run the below commands.

saveCopyzoom_out_map
php bin/magento setup:upgrade

php bin/magento cache:clean

That's it.

We hope this Magento article helped you to know How to Add Customer Fullname on Admin UI Grid in Magento 2.

Bookmark it for your future reference. Do comment below if you have any other questions or doubts.

P.S. Do share this article with your team.

Review other articles maybe it'll help you too.

• Magento 2 Add Image Uploader on Admin UI Form
• Magento 2 Add Image on Admin UI Grid
• How to Create Custom GraphQL in Magento 2
• List of GraphQL Queries and Mutations for Magento 2
• How to Add Image Uploader on Store Configuration in Magento 2
• How to Add Custom Select/MultiSelect Options on Store Configuration in Magento 2
• How to Add Dynamic Row on Store Configuration in Magento 2
• How to Add Date & time Picker on Store Configuration in Magento 2
• How to Use Javascript Mixins in Magento 2
• How to Add Custom Validation Rule in Magento 2
• How to Setup Magento 2 PWA Studio
• How to Get Current Product
• Get Product Collection with Filters