The KendoReact TreeList enables you to display only those TreeList records which meet specified criteria.
To enable filtering:
- Set the
filterprop of the TreeList. The filtering conditions are declared as
- Handle the
onDataStateChangeevent of the TreeList, and filter the data manually or by using the
- Pass the component which will be responsible for the filtering of the column by using the
Each consecutive filter is added to the previous ones and reduces the subset of data.
By default, when filtering is enabled, the TreeList renders a filter row in its header. Based on the type of the filter component which is set in the
filter prop of the columns, the filter row displays components in each column header where the user can filter string, numeric, boolean, or date inputs.
filterCell property of the TreeListColumn enables the full customization of the filter cells.
The following example demonstrates how to implement a filter by using the KendoReact DropDownList component.