Filtering in React Gantt component

Filtering allows you to view specific or related records based on filter criteria. This can be done in the Gantt component by using the filter menu and toolbar search. To enable filtering in the Gantt component, set the allowFiltering to true. Menu -filtering support can be configured using the filterSettings property and toolbar searching can be configured using the searchSettings property.

Menu filtering

The Gantt component provides menu-filtering support for each column. You can enable the filter menu by setting the allowFiltering to true. The filter menu UI will be rendered based on its column type, which allows you to filter data. You can filter the records with different operators.

The allowFiltering property should be set to true to enable the filter menu.
Setting the columns.allowFiltering property to false prevents rendering the filter menu for a particular column.

Filter hierarchy modes

The Gantt component supports a set of filtering modes with the filterSettings.hierarchyMode property. The following are the types of filter hierarchy modes available in the Gantt component:

Parent: This is the default filter hierarchy mode in Gantt. The filtered records are displayed with their parent records. If the filtered records do not have any parent record, then only the filtered records will be displayed.

Child: Displays the filtered records with their child record. If the filtered records do not have any child record, then only the filtered records will be displayed.

Both: Displays the filtered records with their both parent and child records. If the filtered records do not have any parent or child records, then only the filtered records will be displayed.

Search

You can search for records in the Gantt component by using the search method with search key as a parameter. The Gantt component provides an option to integrate the search text box in the toolbar by adding the search item to the toolbar property.