Back to Devexpress

Tutorial: Column Filter Dropdowns

windowsforms-114639-controls-and-libraries-data-grid-getting-started-walkthroughs-filter-and-search-tutorial-column-filter-dropdowns.md

latest9.0 KB
Original Source

Tutorial: Column Filter Dropdowns

  • Nov 12, 2024
  • 7 minutes to read

This walkthrough is a transcript of the Column Filter Dropdowns video available on the DevExpress YouTube Channel.

The tutorial will show you the Microsoft Excel and Microsoft Windows Explorer inspired data filtering features available in the DevExpress WinForms grid, including:

  • Filter dropdown lists
  • Custom Filter Dialogs
  • Most Recently used filter values
  • Filter dropdowns for date-time values
  • Checked lists in filter dropdowns

You will learn what’s available by default and how to disable or customize these UI elements.

Regular Filter Dropdown Lists

Excel-style filter dropdowns are available using the buttons that appear when you hover column headers. For all column types, except date-time, the filter dropdown displays a simple list where you can select one item at a time.

When you select an item, the grid automatically closes the dropdown and filters the grid’s data to display records that have the selected value in the corresponding column.

Dropdown lists also provide the (Custom) item, which invokes the Custom Filter Editor. Much like in Microsoft Excel, this dialog allows end-users to specify up to two filter conditions. Display records whose owner is Mike Roller or Carl Lucas.

You can filter the grid’s data against multiple columns. If you click another column’s filter button, you’ll only see values from the records that meet the previously applied filter criteria. If you need to see values fetched from all records, click the filter button while holding the SHIFT key pressed. If a filter condition is applied to a column, this column’s filter dropdown shows all values.

To clear filtering by a specific column, click the (All) item in the corresponding dropdown list.

After that, you can click a column’s filter button again to find the most recently used items at the top of the list. They are separated from the rest of the items by a double line.

Now close the application and expand the View’s ColumnView.OptionsFilter property. To disable the recently used filter items display, turn off the ColumnViewOptionsFilter.AllowColumnMRUFilterList option. Change the dropdown height by setting the ColumnViewOptionsFilter.ColumnFilterPopupMaxRecordsCount property to 10.

Run the application. Now column header dropdowns display 10 or less items and a vertical scrollbar, if required. Filter dropdowns no longer display the most recently used items.

Calendar Filter Dropdowns

Click the filter button in a date-time column. You’ll see a dropdown that has an embedded calendar in it. After selecting the desired date or interval, the grid immediately filters its data.

You can also use check boxes below the calendar to select common date intervals such as “Earlier this month”, “Earlier this year”, and so on. To clear the current filter, select the Show all check box. To hide the dropdown, click the close button.

Checked Filter Dropdown Lists

You can also use check list dropdowns, much like in newer versions of Microsoft Excel or Windows File Explorer. To enable this mode, select a column, expand its GridColumn.OptionsFilter property and set the OptionsColumnFilter.FilterPopupMode option to FilterPopupMode.CheckedList.

Run the application and click the column’s filter button. Now you can select multiple items simultaneously. Select three values and click OK.

The grid now displays records that have any of those values selected in the dropdown.

To clear filtering against this column, invoke the dropdown, click Select All , and then OK.

Filtering Empty and Null Values

Filter dropdowns provide special items to handle empty or null values. If you select the (Blanks) item in the dropdown, the grid will display records whose values are empty.

In the same manner, you can select (Non Blanks) to filter out those empty values. Similarly, checked dropdown lists provide the (Blanks) item.

Dropdowns for date-time columns don’t include such items by default.

Close the application. To hide the (Blanks) and (Non Blanks) items from dropdowns, set the OptionsColumnFilter.ShowBlanksFilterItems property to False. Select the Fixed Date column and set its OptionsColumnFilter.ShowEmptyDateFilter option to True. This adds a checkbox for null values into date-time filter dropdowns.

Run the application to see the result. Invoke the Priority column dropdown and see that it doesn’t contain (Blanks) and (Non Blanks) items. Then, click the filter button within the Fixed Date column header. Now this column dropdown displays the additional Show Empty check box.

Customizing Filter Dropdown Lists

The grid also allows you to manually customize filter dropdown lists.

  • Customizing Regular Dropdown Lists

  • Customizing Checked Dropdown Lists

See Also

Tutorial: Data Filtering Basics and Filter Panel Settings

Tutorial: Excel-Style Custom Filter Dialog

Tutorial: Filter Editor

Tutorial: Filtering and Locating Rows API

Tutorial: Filter Row

Tutorial: Incremental Search

Tutorial: Search/Find Panel

Filter and Search