PHP 7.3 reaches end of support in December 2021 and Adobe Commerce 2.3.x reaches end of support in April 2022. We strongly recommend planning your upgrade now to Adobe Commerce 2.4.x and PHP 7.4.x to help maintain PCI compliance.

ActionDelete component

Overview

The ActionDelete component provides a user interface for deleting records of the DynamicRows component.

ActionDelete options

Option Description Type Default
component The path to the component’s .js file in terms of RequireJS. String Magento_Ui/js/dynamic-rows/action-delete
links.value Breaks the link established in the link property of the parent (abstract) component. Boolean false
template The path to the component’s .html template. String ui/dynamic-rows/cells/action-delete

Source files

Extends Abstract:

Examples

Integrate ActionDelete component with DynamicRows component

This is an example of how ActionDelete component integrates with DynamicRows component:

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
<form>
    ...
    <dynamicRows name="dynamic_rows">
            <settings>
                ...
            </settings>
            <container name="record" component="Magento_Ui/js/dynamic-rows/record">
                ...
                <actionDelete template="Magento_Backend/dynamic-rows/cells/action-delete">
                    <argument name="data" xsi:type="array">
                        <item name="config" xsi:type="array">
                            <item name="fit" xsi:type="boolean">false</item>
                        </item>
                    </argument>
                    <settings>
                        <additionalClasses>
                            <class name="some-class">true</class>
                        </additionalClasses>
                        <dataType>text</dataType>
                        <label>Actions</label>
                        <componentType>actionDelete</componentType>
                    </settings>
                </actionDelete>
            </container>
        </dynamicRows>
    ...
</form>

Result

ActionDelete Component with Record Component example