How To Add Customer Groups Dropdown in Magento 2.x Admin Form and Grid By UI Component

There are following below steps need to follow to add Customer Groups drop down in Magento 2 Custom module Admin Entry Form & Grid Listing by using UI Component.

Here we are considering you have already created custom module by using UI Component.

Step [1] – Create Customergroup.php file inside Admin UI Component Listing Column

File Path as below
app/code/ Mage2db/John/Ui/Component/Listing/Column/Customergroup.php

<?php

namespace Hni\Ebsgroupmapping\Ui\Component\Listing\Column;

use Magento\Framework\View\Element\UiComponent\ContextInterface;
use Magento\Framework\View\Element\UiComponentFactory;
use Magento\Ui\Component\Listing\Columns\Column;
use Magento\Framework\UrlInterface;
use Magento\Cms\Block\Adminhtml\Page\Grid\Renderer\Action\UrlBuilder;
use Magento\Framework\Pricing\PriceCurrencyInterface;
use Magento\Store\Model\StoreManagerInterface;
/**
 * Class ProductActions
 */
class Customergroup extends Column
{

    /**
     * @var UrlInterface
     */
    protected $urlBuilder;
    /**
     * @var PriceCurrencyInterface
     */
    protected $priceFormatter;
    /**
     * @var actionUrlBuilder
     */
    protected $actionUrlBuilder;
    /**
     * @var $_storeManager
     */
    protected $_storeManager;


    /**
     * @param ContextInterface $context
     * @param UiComponentFactory $uiComponentFactory
     * @param UrlInterface $urlBuilder
     * @param array $components
     * @param array $data
     */
    public function __construct(
        ContextInterface $context,
        UiComponentFactory $uiComponentFactory,
        UrlInterface $urlBuilder,
        UrlBuilder $actionUrlBuilder,
        PriceCurrencyInterface $priceFormatter,
        StoreManagerInterface $storeManager,
		\Magento\Customer\Ui\Component\Listing\Column\Group\Options $groups,
        array $components = [],
        array $data = []
    ) {
        $this->urlBuilder = $urlBuilder;
        $this->actionUrlBuilder = $actionUrlBuilder;
        $this->priceFormatter = $priceFormatter;
        $this->_storeManager = $storeManager;
		$this->groups = $groups;
        parent::__construct($context, $uiComponentFactory, $components, $data);
    }
	
	

    /**
     * Prepare Data Source
     *
     * @param array $dataSource
     * @return array
     */
    public function prepareDataSource(array $dataSource)
    {
        if (isset($dataSource['data']['items'])) {
			
            foreach ($dataSource['data']['items'] as & $item) {
	
   	            $customergroups = $this->groups->toOptionArray();
			    $p=0;
				  foreach ($customergroups as $group) {
					  
				  if($customergroups[$p]['value']==$item['customer_groupid']){
							$groupname = $customergroups[$p]['label'];
						}
				  $p++;		
				  }

                $item[$this->getData('name')] = $groupname;
				
            }
        }
        return $dataSource;
    }
}

Step [2] – Add below code in Admin UI Component Grid Listing.

File Path as below [Instead of UIGridListing.xml use your UI Admin Grid Listing file name]
app/code/ Mage2db/John/view/adminhtml/ui_component/UIGridListing.xml

<column name="customer_groupid" class="Hni\Ebsgroupmapping\Ui\Component\Listing\Column\Customergroup">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="component" xsi:type="string">Hni_Ebsgroupmapping/js/ui/grid/columns/html</item>
<item name="align" xsi:type="string">left</item>
<item name="sortable" xsi:type="boolean">false</item>
<item name="label" xsi:type="string" translate="true">Customer Group</item>
<item name="sortOrder" xsi:type="number">60</item>
</item>
</argument>
</column>

Step [3] – Add below code in Admin UI Component Grid Entry Form

File Path as below [Instead UIGridEntryForm .xml use your UI Admin UI Form file name]
app/code/ Mage2db/John/view/adminhtml/ui_component/UIGridEntryForm.xml

<field name="customer_groupid" sortOrder="40" formElement="select">
<settings>
<label translate="true">Customer Group</label>
</settings>
  <formElements>
   <select>
   <settings>
   <options  class="Magento\Customer\Model\Customer\Source\GroupSourceInterface"/>
   </settings>
   </select>
  </formElements>
</field>

Finally Customers drop down has been added in Magento 2 Admin Grid Entry Form as well as It’s corressponding value displaying in Magento 2 Admin Grid Listing by using UI Component.

How To Create Events & Observer Using Custom Module in Magento / Adobe Commerce 2.x

How To Create Preference Using Custom Module in Magento / Adobe Commerce 2.x

How To Create Plugin Using Custom Module in Magento / Adobe Commerce 2.x

How To Get Base URL in Magento 2.x / Adobe Commerce 2.x

How To Create Custom Module in Magento 2.x / Adobe Commerce 2.x

How To Add Custom Block on Cart Page in Magento 2.x / Adobe Commerce 2.x

How To Create a Custom Log File in Magento 2.x / Adobe Commerce 2.x

How To Create Custom Controller in Magento 2.x / Adobe Commerce 2.x

How To Create a Custom Console Command in Magento 2.x / Adobe Commerce 2.x

How To Add Customer Groups Dropdown in Magento 2.x Admin Form and Grid By UI Component in Magento 2.x / Adobe Commerce 2.

How To Get all Customers Data in Magento 2.x / Adobe Commerce 2.x

How To Set Tier Price With Percentage Value Programmatically in Magento 2.x / Adobe Commerce 2.x