# Filtering

To enable the filtering functionality, set the [`filterable`](https://www.telerik.com/kendo-vue-ui-develop/components/dropdowns/api/dropdowntreeprops#filterable) property to `true`.

<CtaPanelOverview></CtaPanelOverview>

## Basic Configuration

When the filtering functionality is enabled, the DropDownTree component renders a filter input in the drop-down list. On every character input, the DropDownTree triggers a [`onFilterChange`](https://www.telerik.com/kendo-vue-ui-develop/components/dropdowns/api/dropdowntreeprops#onfilterchange) event. The event argument contains the typed string value that you can use to filter the source.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/dropdowns/dropdowntree/filtering/source.txt)

## Visualize Filtering

You can toggle the [`loading`](https://www.telerik.com/kendo-vue-ui-develop/components/dropdowns/api/dropdowntreeprops#loading) property and provide the user with a visual indication of the filtering process.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/dropdowns/dropdowntree/filtering-loading/source.txt)

## Suggested Links

* [API Reference of the DropDownTree](https://www.telerik.com/kendo-vue-ui-develop/components/dropdowns/api/dropdowntreeprops)