How to include Tree in to Mass Action Dropdown in Backend in Magento 2

In this article, we are going to discuss how to include Tree into Mass Action Drop-down in Backend  in Magento 2  by the following steps:

Step 1: State the UI component dynamic action

Step 2: State the Action Resource class

Step 3: State the mass action in the ui_component xml file

Tree action support in Magento 2 backend grid you can see this in the change status process on the product listing page. When you choose to change the transition, you can choose the choice to enable/disable products in mass.

 add tree actions into Mass Action dropdown in backend

You can find the commands to announce this action by Magento_Catalog module Ui_component

/vendor/magento/magento-catalog/view/adminhtml/ui_component/product_listing.xml

<span style="font-weight: 400;">    </span>
 <massaction name="listing_massaction">

            <argument name="data" xsi:type="array">

                <item name="config" xsi:type="array">

                    <item name="component" xsi:type="string">Magento_Ui/js/grid/tree-massactions</item>

                </item>

            </argument>

            ...

            <action name="status">

                <argument name="data" xsi:type="array">

                    <item name="config" xsi:type="array">

                        <item name="type" xsi:type="string">status</item>

                        <item name="label" xsi:type="string" translate="true">Change status</item>

                    </item>

                </argument>

                <argument name="actions" xsi:type="array">

                    <item name="0" xsi:type="array">

                        <item name="type" xsi:type="string">enable</item>

                        <item name="label" xsi:type="string" translate="true">Enable</item>

                        <item name="url" xsi:type="url" path="catalog/product/massStatus">

                            <param name="status">1</param>

                        </item>

                    </item>

                    <item name="1" xsi:type="array">

                        <item name="type" xsi:type="string">disable</item>

                        <item name="label" xsi:type="string" translate="true">Disable</item>

                        <item name="url" xsi:type="url" path="catalog/product/massStatus">

                            <param name="status">2</param>

                        </item>

                    </item>

                </argument>

            </action>

            ...

        </massaction>

Magento has offered the component to show the tree action: Magento_Ui / JS / Grid / Tree Mass-actions. Then announce the two actions to Enable / Disable the processes. You can use this way to include more change status action such as Mark as New, Mark as Sold-Out. However, if you want to add dynamic actions to retrieve them from PHP code, this is a bad solution.

I will explain you another example that cannot announce mass actions in the Ui_component xml file. I list items for sale, and then I have to allocate them to Magento users using mass actions. See the screenshot below to understand this example.

 add tree actions into Mass Action dropdown in backend

I have another solution to include a dynamic option into the Mass Action drop-down. Follow some simple steps below.

  1. State the UI component dynamic action

/app/code/[NameSpace]/[ModuleName]/Ui/Component/Listing/MassActions/DynamicAction.php

<?php

namespace [NameSpace]\[ModuleName]\Ui\Component\Listing\MassActions;

class DynamicAction extends \Magento\Ui\Component\Action

{

    /**

     * @inheritDoc

     */

    public function prepare()

    {

        $config = $this->getData('config');

        if(isset($config['action_resource'])) {

             $this->actions = $config['action_resource']->getActions();

        }        

        parent::prepare();        

    }
   

}
  1. State the Action Resource class

/app/code/[NameSpace]/[ModuleName]/Ui/DataProvider/UserActions.php

This class receives all Magento users and then produces allotted actions for each user.

<?php

namespace [NameSpace]\[ModuleName]\Ui\DataProvider;

use Magento\User\Model\ResourceModel\User\CollectionFactory;

use Magento\Framework\UrlInterface;

class UserActions

{

    /**

     * @var CollectionFactory

     */

    protected $collectionFactory;

    

    /**

     * @var UrlInterface

     */

    protected $urlBuilder;

   
    public function __construct(CollectionFactory $collectionFactory, UrlInterface $urlBuilder)

    {

        $this->collectionFactory = $collectionFactory;

        $this->urlBuilder = $urlBuilder;

    }

    /**

     * get actions

     *

     * @return array

     */

    public function getActions()

    {

        $actions = [];

        $users = $this->collectionFactory->create();

        foreach($users as $user) {

            $actions[] = [

                'type' => $user->getUserName(),

                'label' => $user->getName(),

                'url' => $this->urlBuilder->getUrl('*/*/assignUser', ['user_id' => $user->getId()]),

            ];

        }

        return $actions;        

    }

}
  1. State the mass action in the ui_component xml file

/app/code/[NameSpace]/[ModuleName]/view/adminhtml/ ui_component/sales_item_listing.xml

<massaction>

    <argument name="data" xsi:type="array">

        <item name="config" xsi:type="array">

            <item name="component" xsi:type="string">Magento_Ui/js/grid/tree-massactions</item>

        </item>

    </argument>            

    <action name="add-batch" class="[NameSpace]\[ModuleName]\Ui\Component\Listing\MassActions\DynamicAction">

        <argument name="data" xsi:type="array">

            <item name="config" xsi:type="array">

                <item name="type" xsi:type="string">add-batch</item>

                <item name="label" xsi:type="string" translate="true">Assign to User</item>

                <item name="action_resource" xsi:type="object">[NameSpace]\[ModuleName]\Ui\DataProvider\UserActions</item>

            </item>

        </argument>

    </action>                

</massaction>

The above-mentioned steps are the smallest process of adding a tree to the Mass Action dropdown in the backend. With this provided guide, you can easily manage the dropdown in the backend mass action. Each store has a Mass Action Dropdown in the backend with various elements.

Last Update: September 5, 2019  

March 8, 2018   1232   Nandini Ramachandran    Operations    
Total 1 Votes:
0

Tell us how can we improve this post?

+ = Verify Human or Spambot ?

Leave a Reply

Your email address will not be published. Required fields are marked *

Facebook
Twitter
INSTAGRAM
LinkedIn