Filter Data in Blazor TreeList

• Jun 23, 2025
• 2 minutes to read

The DevExpress Blazor TreeList allows you to filter data in UI and in code.

You can use the FilterTreeMode property to specify how the component displays nodes that meet filter criteria with all available filter options:

EntireBranch

The TreeList component displays a node that meets the filter criteria and all its parent and child nodes, even if they do not meet that criteria.

Nodes

The TreeList component ignores parent-child relationships and displays all nodes that meet the filter criteria at one level. This mode improves overall performance when the TreeList is bound to a large remote data source.

ParentBranch

The TreeList component displays a node that meets the filter criteria and all its parent nodes, even if they do not meet that criteria.

Filter Row UI

The filter row displays in-place editors for all data columns. When a user types into an editor, the TreeList creates a filter condition based on the editor value and applies this condition to the column.

For more information, see the following topic: Filter Row in Blazor TreeList.

Run Demo: TreeList - Filter Row

Search Box UI

The TreeList includes a built-in search box. It searches all visible columns, filters rows, and highlights matches. Searches are case-insensitive.

For more information, see the following topic: Search Box in Blazor TreeList.

Run Demo: TreeList - Search Box

Column Filter Menu

An Excel-inspired drop-down filter displays unique column values as a list or hierarchy, includes a search box, and the Select All option.

For more information, see the following topic: Column Filter Menu in Blazor TreeList.

Run Demo: Column Filter Menu

Filter API

The TreeList implements methods to filter data in code. For more information, see the following topic: Filter API in Blazor TreeList.

Run Demo: TreeList - Filter API