How to Filter WPF DataGrid with Excel Like Ui filtering?
Our WPF SfDataGrid feature tour page provides excel like filtering UI and also advanced filter UI to filter the data easily. UI filtering can be enabled by setting SfDataGrid.AllowFiltering property to true , where you can open filter UI by clicking the Filter icon in column header and filter the records.
<syncfusion:SfDataGrid x:Name="dataGrid"
AutoGenerateColumns="False"
AllowFiltering="True"
ColumnSizer="Star"
AllowEditing="True"
ItemsSource="{Binding ProductInfo}">
You can enable/disable filtering for particular column by setting GridColumn.AllowFiltering property.
<syncfusion:GridTextColumn HeaderText="Product" MappingName="Product" AllowFiltering="True" />
- GridColumn.AllowFiltering has higher priority than SfDataGrid.AllowFiltering property.
- UI filtering is not supported when using on-demand paging by setting UseOnDemandPaging to true.
Built-in UI Views
SfDataGrid filter UI comprises of two different UIs.
- Checkbox Filter UI - Provides excel like filter interface with list of check boxes.
- Advanced Filter UI - Provides advanced filter options to filter the data.
By default, both Checkbox Filter and Advanced Filter are loaded while opening the filter pop-up. You can switch between AdvancedFilter and CheckboxFilter by using AdvancedFilter button in the UI View.
Checkbox Filter UI
In CheckBoxFilterControl a list with checkboxes in show FilterElement, you may need to filter out all data which the checkboxes are checked or filter out all data which the checkboxes are unchecked.
The following are the control parts of Checkbox Filtering.
Advanced Filter UI
Advanced filter UI provides multiple filter options to filter the data easily. Filter menu options are loaded based on Advanced filter type by automatically detecting the underlying date type.
Below are the built-in filter types supported.
- Text Filters – Loads various menu options to filter the display text effectively.
- Number Filters – Loads various menu options to filter the numeric data.
- Date Filters – Loads various menu options and DatePicker to filter DateTime type column.
Text Filters | Number Filters | Date Filters |
|---|---|---|
When the string value is bounded to the GridColumn or the items source is dynamic ,then TextFilters are loaded in AdvancedFilterControl. | When integer, double, short, decimal, byte or long are bound to the GridColumn then Number Filters are loaded in AdvancedFilterControl.
| When the DateTime type value is bound to the GridColumn , then Date Filters are loaded in AdvancedFilterControl.
|
| | |
Filter menu options
|
Filter menu options 1. Equals 2. Does Not Equal 3. Null 4. Not Null 5. Less Than 6. Less Than or Equal 7. Greater Than 8. Greater Than or Equal | Filter menu options
|
- Null and Not Null options are available only when AllowBlankFilters is set to True.
- If the column is GridUnboundColumn or GridMaskColumn, then Text Filters will be loaded.
Take a moment to peruse the WPF DataGrid - Filtering documentation, where you can find about Filtering with code examples.
Please refer this link to know about the essential features of WPF DataGrid.
View WPF DataGrid Filter Demo in GitHub.
