This is archived documentation for Magento v2.2 and is no longer supported. Go to the latest documentation.

FiltersChips component

The FiltersChips component provides UI controls that allows users to remove the previously-applied values of the Filters and Search components.

Configuration options

Option Description Type Default Value
component The path to the component’s .js file. String Magento_Ui/js/grid/filters/chips
componentType The type of component. String filtersChips
template Path to the component’s .html template. String ui/grid/filters/chips

Source files

Extends uiCollection:

Examples

Integrate the FiltersChips component as a grid (default) with the Filters component

This is an example of how the FiltersChips component integrates with the Filters component:

1
2
3
4
5
6
7
8
9
10
11
12
13
<listing>
    <listingToolbar>
        <filters name="listing_filters">
            <settings>
                <chipsConfig>
                    <param name="component" xsi:type="string">Magento_Ui/js/grid/filters/chips</param>
                    <param name="componentType" xsi:type="string">filtersChips</param>
                    <param name="template" xsi:type="string">ui/grid/filters/chips</param>
                </chipsConfig>
            </settings>
        </filters>
    </listingToolbar>
</listing>

Result

FiltersChips Component example