PHP 7.3 reaches end of support in December 2021 and Adobe Commerce 2.3.x reaches end of support in April 2022. You may want to consider planning your upgrade now to Adobe Commerce 2.4.x and PHP 7.4.x to help maintain PCI compliance.

Search component

Edit on GitHub Log an Issue

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

© 2021 Adobe. All rights reserved.