Filters component

Overview

The Filters component renders UI controls for filtering and applies filtering. Must be a child of the Listing component.

See the Admin Design Pattern Library (Filters) topic for information about the UI design patterns that can be implemented using Filters component.

Structure

Constructor: app/code/Magento/Ui/view/base/web/js/grid/filters/filters.js

Filters configuration

Extends all uiCollection configuration.

Filters-specific configuration:

Option Description Type Default Value
chipsConfig Configuration passed to the FiltersChips component. Object Configuration that is passed to the FiltersChips component.
statefull Defines a list of component properties whose values are automatically saved in the configured storage if they change. key is the property's name and the value defines whether its saved. {
[name: string]: Boolean
}
stickyTmpl Additional .html template that displays filters when the Toolbar component gets a fixed position. String ui/grid/sticky/filters
template Path to the component’s .html template. String ui/grid/filters/filters
templates.filters Describes basic filter types. This definitions are used to dynamically create filter elements based on the filter field specified in the corresponding column. For example, if a column's filter property contains the text value, then a Filter component instance with a definition for the text type will be created. Object Contains definitions of the text, select,dateRange and textRange filter types.