/   /   /  Magento 2 backend add custom grid action (target _self or _blank)

Note:

For more extensions and themes visit our store

Magento 2 backend add custom grid action (target _self or _blank)


Ok the new generation of ui grid in magento 2 give you the ability to create or change grid  with xml file, this xml use external php file for getting all part needed .
Our example here is the grid action like edit in catalog product grid or delete preview in page cms grid ,
ok we want add custom action .

Ok the xml responsible for ui grid of  product list in backend is vendor/magento/module-catalog/view/adminhtml/ui_component/product_listing.xml , and for action you will inside this file :

  1.  
  2. <item name="fieldAction" xsi:type="array">
  3.      <item name="provider" xsi:type="string">product_listing.product_listing.product_columns.actions</item>
  4.              <item name="target" xsi:type="string">applyAction</item>
  5.                    <item name="params" xsi:type="array">
  6.                    <item name="0" xsi:type="string">edit</item>
  7.               <item name="1" xsi:type="string">${ $.$data.rowIndex }</item>
  8.      </item>
  9.  </item>
  10.  

it's tell to grid : the current row  get the url from edit action but the important part is in the last of file :

  1.  
  2.         <actionsColumn name="actions" class="Magento\Catalog\Ui\Component\Listing\Columns\ProductActions">
  3.             <argument name="data" xsi:type="array">
  4.                 <item name="config" xsi:type="array">
  5.                     <item name="indexField" xsi:type="string">entity_id</item>
  6.                     <item name="sortOrder" xsi:type="number">200</item>
  7.                 </item>
  8.             </argument>
  9.         </actionsColumn>
  10.  

the ui grid use the class  Magento\Catalog\Ui\Component\Listing\Columns\ProductActions for adding all action related to this ui grid we go to class in path vendor/magento/module-catalog/Ui/Component/Listing/Columns/ProductActions.php , we find:

  1.  
  2.     public function prepareDataSource(array $dataSource)
  3.     {
  4.         if (isset($dataSource['data']['items'])) {
  5.             $storeId = $this->context->getFilterParam('store_id');
  6.             foreach ($dataSource['data']['items'] as &$item) {
  7.                 $item[$this->getData('name')]['edit'] = [
  8.                     'href' => $this->urlBuilder->getUrl(
  9.                         'catalog/product/edit',
  10.                         ['id' => $item['entity_id'], 'store' => $storeId]
  11.                     ),
  12.                     'label' => __('Edit'),
  13.                     'hidden' => false,
  14.                 ];
  15.             }
  16.         }
  17.       return $dataSource;
  18.     }
  19.  

this method is responsible to adding action ,

Ok now we want add our action , it's simple you need grid plugin in your module and add event 'after' , and push your action , inside Ibnab/CustomAction/etc/adminhtml/di.xml (Ibnab = YouVendor , CustomAction= YourModule) :

  1.  
  2. <?xml version="1.0"?>
  3. <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
  4.     <type name="Magento\Catalog\Ui\Component\Listing\Columns\ProductActions">
  5.         <plugin name="prepare_data_source_after" type="Ibnab\CustomAction\Plugin\Adminhtml\ProductActions"/>
  6.     </type>
  7. </config>
  8.  

Ok now create your class in :
Ibnab/CustomAction/Plugin/Adminhtml/ProductActions .php and push :

  1.  
  2. <?php
  3. namespace Ibnab\CustomAction\Plugin\Adminhtml;
  4. use Magento\Framework\View\Element\UiComponent\ContextInterface;
  5. use Magento\Framework\Url;
  6. class ProductActions {
  7.     protected $urlBuilder;
  8.     protected $context;
  9.     public function __construct(
  10.     ContextInterface $context, Url $urlBuilder
  11.     ) {
  12.         $this->urlBuilder = $urlBuilder;
  13.         $this->context = $context;
  14.     }
  15.     public function afterPrepareDataSource($productActions, $result) {
  16.             if (isset($result['data']['items'])) {
  17.                 $storeId = $this->context->getFilterParam('store_id');
  18.                  foreach ($result['data']['items'] as &$item) {
  19.                 $item[$productActions->getData('name')]['preview'] = [
  20.                     'href' => $this->urlBuilder->getUrl('catalog/product/view', ['id' => $item['entity_id'], '_nosid' => true]),
  21.                     'target' => '_blank',
  22.                     'label' => __('ُPreview'),
  23.                 ];
  24.                 }
  25.             }   
  26.         return $result;
  27.     }
  28. }
  29.  

thats is all .

Comments

IBNAB is a company made of a group of professionals whose work is providing secure open source solutions. Our company strives for reaching magnificent results with each experience and provides professional open source solutions that cover every part of the business process.