Premium
The KendoReact Data Grid provides powerful filtering options, including column menu filtering, external filters, custom filter operations, and multi-column filtering.
The Advanced Filtering feature of the Grid is part of KendoReact premium, an enterprise-grade UI library with 120+ free and premium components for building polished, performant apps. Test-drive all features with a free 30-day trial.Start Free Trial Filtering Data Grid Through Column Menu FilterThe columnMenu allows using the GridColumnMenuFilter or the GridColumnMenuCheckboxFilter to filter the Grid through a popup menu.
You can use the KendoReact Filter component to build complex filter expressions and filter the data inside the Grid.
Filtering Data Grid Through Custom Filter CellsThe filterCell property of the GridColumn enables full customization of the filter cells. The following example demonstrates filtering by category and price range using a DropDownList.
You can use an external TextBox to apply quick filter to the Grid.
Filtering Data Grid Rows by Using thefilterBy Method
To use the filterBy method set the filter property of the Grid with the current filter expression and handle the onFilterChange.
process Method
When multiple data operations (filtering, sorting, paging, etc.) are enabled, using the process method and the data state from the onDataStateChange event is the recommended approach.
Customize the filter operators for numeric, text, and date filter types using the filterOperators property. Boolean filter types always use the equal operator.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4