GRID FEATURE
Search across columns
Quick search looks for text across searchable columns without specifying a column. It is a useful starting point when users do not know whether a term is a product name or a region.
How it works and when to use it
Find navigates to matching cells; Quick filter hides nonmatching rows. Present them according to these distinct purposes.
In the code, grid is the Grid element prepared in the installation chapter. Check each example's data and settings, and implement the app functions and server endpoints for your project.
Example 1. Pass a global search term
Connect your app's search input to quickFilterText.
grid.quickFilter = true;
grid.quickFilterText = 'Platform';Verify the result: Only matching rows remain in the current data. To search data not yet loaded, pass the term in remote requests.
Example 2. Multiple-word conditions
Compare searches requiring both words with searches allowing either word.
grid.quickFilterMode = 'and';
grid.quickFilterText = 'Platform APAC';
// To show rows matching either word:
// grid.quickFilterMode = 'or';Verify the result: Word combinations change the results. Explain the condition relationship in the search input's guidance.
Example 3. Tune input frequency and clear search
Adjust the delay to avoid expensive calculations or server requests on every keystroke.
grid.quickFilterDebounce = 200;
grid.quickFilterText = '';Verify the result: An empty string clears the search term. If your app enables regular expressions, also test invalid and overly broad patterns.
Combining features and troubleshooting
Do not assume search includes every property of the source object. Check column configuration, display rules, and access rules together.
Previous results may remain briefly between search changes and server responses. Distinguish loading from no results.
Related reading
- How rows, columns, and IDs relate
- Connect results and events
- Explore in Features
The guide describes which interactions are available to try.