GRID FEATURE · PRO

Find cell content

Find highlights matching cells and moves between results without reducing the row list. Use it when users need to keep reading surrounding rows.

Markdown source Features

How it works and when to use it

Find searches loaded rows and readable, displayed columns. It differs from a global search covering hidden columns or data that exists only on the server.

Using this feature in a product requires the Pro package and a valid license. Matching setting names do not enable Pro features in Community.

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.

Installation and integration · Shared sample data

Example 1. Enable the Find tool

Provide a search input and result navigation inside the Grid.

javascript

grid.find = true;

Verify the result: Enter Atlas to move between matching cells while retaining surrounding rows. Unlike quick search, this does not filter the whole list.

Example 2. Find within filtered results

Filter by the responsible team first, then use Find to locate a particular product.

javascript

grid.quickFilter = true;
grid.quickFilterText = 'Platform';
grid.find = true;

Verify the result: Filtering narrows the data scope; Find helps navigate within it. Label the two inputs to distinguish their purposes.

Example 3. Check restricted columns

Hide sensitive columns or apply canReadCell in your app, then search for their values. Verify that highlights, counts, and tooltips do not reveal hidden values.

Verify the result: Find must operate only on values the user can read. Provide a separate server search for remote rows that have not loaded.

Combining features and troubleshooting

No Find results does not necessarily mean the value is absent from the full data set. Explain the loaded scope and filter state.

Do not distinguish results through highlight color alone. Provide keyboard focus and previous/next navigation as well.