This is a beta release of documentation for Magento 2.4, published for previewing soon-to-be-released functionality. Content in this version is subject to change. Links to the v2.4 code base may not properly resolve until the code is officially released.

TreeMassActions component

Edit on GitHub
Log an Issue

The TreeMassActions component is a decorator for MassActions that adds the support of nested actions.

Configuration options

Option Description Type Default
submenuTemplate Path to the .html template used to render nested actions. String ui/grid/submenu
template Path to the component’s .html template. String ui/grid/tree-massactions
actions A list of available actions. (MassActionContainer | MassAction)[] -

MassActionContainer interface

Option Description Type Required
label Action’s label displayed in the list of actions. String Required
type Action’s identifier. String Required
actions A list of child elements that may contain both MassActionContainer and MassAction instances. (MassActionContainer | MassAction)[] Required

Source files

Extends MassActions:

Example

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

<listing>
    ...
    <listingToolbar>
        ...
        <massaction name="listing_massaction" component="Magento_Ui/js/grid/tree-massactions">
            <action name="action_example">
                <argument name="data" xsi:type="array">
                    <item name="config" xsi:type="array">
                        <item name="type" xsi:type="string">action</item>
                        <item name="label" xsi:type="string" translate="true">Actions</item>
                    </item>
                </argument>
                <argument name="actions" xsi:type="array">
                    <item name="0" xsi:type="array">
                        <item name="type" xsi:type="string">sub_action1</item>
                        <item name="label" xsi:type="string" translate="true">Sub action #1</item>
                        <item name="url" xsi:type="url" path="some/path">
                            <param name="some_param">1</param>
                        </item>
                    </item>
                    <item name="1" xsi:type="array">
                        <item name="type" xsi:type="string">sub_action2</item>
                        <item name="label" xsi:type="string" translate="true">Sub action #2</item>
                        <item name="url" xsi:type="url" path="some/path">
                            <param name="some_param">2</param>
                        </item>
                    </item>
                    <item name="2" xsi:type="array">
                        <item name="type" xsi:type="string">sub_action3</item>
                        <item name="label" xsi:type="string" translate="true">Sub action #3</item>
                        <item name="url" xsi:type="url" path="some/path">
                            <param name="some_param">3</param>
                        </item>
                    </item>
                </argument>
            </action>
        </massaction>
        ...
    </listingToolbar>
    ...
</listing>

Result

TreeMassActions Component Example

© 2020 Magento. All rights reserved.