Tree Grid / Filtering / Search

Blazor Tree Grid Example - Search

Loading Syncfusion Blazor Server Demos…

This sample demonstrates the search functionality in Tree Grid. Records can be filtered by entering a keyword into the search box in the toolbar.

Tree Grid supports searching records interactively using the search box in the toolbar. When a keyword is entered, the Tree Grid filters and displays matching records based on the configured hierarchy mode.

The search behavior can be customized using the HierarchyMode property of TreeGridSearchSettings, which determines how parent and child records are displayed in the search results:

  • Parent - This is the default search hierarchy mode in Tree Grid. The searched records appear alongside their parent records. If none of the searched records have a parent record, only the searched record itself is displayed.
  • Child - The searched records are shown alongside their child records. If the searched records have no child records, only the searched records are displayed.
  • Both - The searched records are shown alongside their parent and child records. If there are no parent or child records in the searched records, only the searched records will be displayed.
  • None - Only the actual searched records are displayed.

In this demo, the Parent hierarchy mode is enabled by default. When you type a keyword into the search box in the toolbar, Tree Grid filters the records and displays matches along with their parent rows.

More information about searching in Tree Grid can be found in this documentation section.

Transform your Blazor web apps today with Syncfusion® Blazor components
145+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE