ExportButton component

Edit on GitHub
Log an Issue

The ExportButton component implements the ability to export grid data to the specified data format (cvs, xml, and so on).

Configuration options

Option Description Type Default Value
additionalParams List of additional parameters added to each performed request. {
[name: string]: string
}		 []
options List of available formats in which the table’s data can be exported. Array<ExportOption> [{
value: "csv",
label: "CSV",
url: "mui/export/gridToCsv"
}, {
value: "xml",
label: "Excel XML",
url: "mui/export/gridToXml"
}]
template Path to the component’s .html template. String ui/grid/exportButton
checked The checked data format to export. String ''

ExportOption interface

Option Description Type Required
label Option’s label. String Required
url Path to controller that will process the request. String Required
value Identifier of the export option. String Required

Examples

Configure component

To enable the ExportButton component, add the exportButton element with a selectProvider item to the listing configuration file:

1
2
3
4
5
6
7

<exportButton name="export_button">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="selectProvider" xsi:type="string">{select_provider_path}</item>
        </item>
    </argument>
</exportButton>

The following is an example of configuring the component using thesales_order_grid selectProvider item, <Magento_Sales_module_dir>/view/adminhtml/ui_component/sales_order_grid.xml.

1
2
3
4
5
6
7
8
9
10
11

<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
    <container name="listing_top">
        <exportButton name="export_button">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="selectProvider" xsi:type="string">sales_order_grid.sales_order_grid.sales_order_columns.ids</item>
                </item>
            </argument>
        </exportButton>
    </container>
</listing>

By default Magento allows CSV and Excel XML export data formats.

Add new export format

To add new export format:

Source files

Extends UiElement:

© 2020 Magento. All rights reserved.