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
:
- app/code/Magento/Ui/view/base/web/js/grid/filters/chips.js
- app/code/Magento/Ui/view/base/web/templates/grid/filters/chips.html
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>