This sample demonstrates the filtering capabilities of the Grid using multiple filter types. It shows how users can interact with different filtering options to refine and view data efficiently.
|
Filter Type
|
|
The filtering feature allows users to display only the matching records based on filter criteria. To enable filtering, set the allowFiltering property to true. The Grid supports the following filter types: Menu CheckBox Excel These can be configured using the filterSettings.type property. In this sample, the Menu filter is enabled by default, and you can switch to "CheckBox" or "Excel" filters using the dropdown. When using "CheckBox" or "Excel" filters, the Grid provides two enhancements: On-demand loading (Performance): Loads data only when needed, which improves speed and efficiency when working with large datasets. This can be enabled by setting the filterSettings.enableInfiniteScrolling property to true. Immediate filtering (UI Experience): Applies filters instantly as soon as items are checked or unchecked, which provides a smoother interaction. This can be enabled by setting the filterSettings.mode property to Immediate. Injecting Module: Features of the Grid component are organized into individual, feature-specific modules. To use filtering functionality, inject the Filter module by Grid.Inject(Filter). More information on the filter configuration can be found in the documentation section. Looking for the full TypeScript Data Grid component overview, features, pricing, and documentation? Visit our TypeScript Data Grid component page Looking for the full TypeScript Data Grid component overview, features, pricing, and documentation? Visit our TypeScript Data Grid component page