Adobe Commerce 2.3 reached end of support in September 2022.

Search component

The Search component allows searching through the grid records. It is a generic tool for filtering content that aggregates all other filter elements.

Configuration options

Option Description Type Default Value
label The search field label. String $t('Keyword')
placeholder Value displayed when the search field is empty. String 'Search by keyword'
statefull.value Defines that value property is automatically saved in the configured storage if a change. Boolean true
template Path to the component’s .html template. String ui/grid/search/search

Source files

Extends UiElement:

Examples

Integrate Search component with Listing component

This is an example of how the Search component integrates with the Listing component:

1
2
3
4
5
6
7
8
<listing>
    ...
    <listingToolbar>
        ...
        <filterSearch name="fulltext"/>
    </listingToolbar>
    ...
</listing>

Result

Search Component Example