# Filtering

The KendoReact Gantt enables you to display only those Gantt records which meet specified criteria.

## Getting Started

To enable filtering:

1. Set the [`filter`](https://www.telerik.com/kendo-react-ui/components/gantt/api/ganttprops#filter) prop of the Gantt. The filtering conditions are declared as [`FilterDescriptors`](https://www.telerik.com/kendo-react-ui/components/dataquery/api/filterdescriptor).
2. Handle the [`onFilterChange`](https://www.telerik.com/kendo-react-ui/components/gantt/api/ganttprops#onfilterchange) or the [`onDataStateChange`](https://www.telerik.com/kendo-react-ui/components/gantt/api/ganttprops#ondatastatechange) event of the Gantt, and filter the data manually or by using the [`filterBy`](https://www.telerik.com/kendo-react-ui/components/gantt/api/filterby) function.
3. Pass the component which will be responsible for the filtering of the column by using the [`filter`](https://www.telerik.com/kendo-react-ui/components/gantt/api/ganttcolumnprops#filter) prop.

Each consecutive filter is added to the previous ones and reduces the subset of data.

## Filter Rows

By default, when filtering is enabled, the Gantt 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.

[Demo Source](https://demos.telerik.com/kendo-react-ui/gantt/filtering/func/source.txt)

## Suggested Links

* [React Gantt](https://www.telerik.com/kendo-react-ui/components/gantt)
* [API Reference of the KendoReact Gantt](https://www.telerik.com/kendo-react-ui/components/gantt/api/gantt)
* [API Reference of the KendoReact GanttProps](https://www.telerik.com/kendo-react-ui/components/gantt/api/ganttprops)
