Column Menu
The KendoReact Gantt enables you to show a menu with quick actions for its columns.
The column menu provides flexible options for high-level customization. For example, the regular sorting and filtering features are represented by individual components which allows you to implement complex scenarios and meet the specific requirements of your project.
Basic Usage
To configure the column menu, use the columnMenu
option of the columns and pass the corresponding ColumnMenu component base on the column data type.
Customizing the Column Menu
The built-in Column Menu components can be customized using their props, which includes show and hide of the sort buttons, and customizing filtering components.
The following example demonstrates how to customize the column menus:
- Text ColumnMenu
- change filter operators
- disable the logic DropDownList
- change the initial filter, which changes the default values of the filter components
- Numeric ColumnMenu
- setting a single filter in the
filterContent
prop - change the
initialFilter
, which is required since we use a single filter
- setting a single filter in the
- Date ColumnMenu
- remove sorting
- Boolean ColumnMenu
- implement a custom filter editor
Adding Custom Items to the Column Menu
The Column Menu items can be changed using the ColumnMenu itemsRender prop. The following example demonstrates how to remove the filtering item and Toggle Columns items: