Search

Vue Data GridSet Filter - Excel Mode

Enterprise

The Set Filter is a more powerful version of Excel's AutoFilter, allowing users to easily build more complex sets for filtering in less time. However, sometimes you may want to provide your users with an Excel-like experience. For this you can use Excel Mode.

Enabling Excel Mode

To enable Excel Mode, simply add the excelMode option to your filter params:

<ag-grid-vue
    :columnDefs="columnDefs"
    /* other grid options ... */>
</ag-grid-vue>

this.columnDefs = [
    {
        field: 'animal',
        filter: 'agSetColumnFilter',
        filterParams: {
            // can be 'windows' or 'mac'
            excelMode: 'windows',
        },
    }
];

Excel's AutoFilter behaves differently depending on whether you are using the Windows or Mac version. The grid therefore allows you to choose which behaviour you would like by setting excelMode to 'windows' or 'mac' respectively.

The example below demonstrates the differences between the different modes:

  • The Default column demonstrates the default behaviour of the Set Filter in the grid.
  • The Excel (Windows) column demonstrates the behaviour of the Set Filter in Windows Excel Mode.
  • The Excel (Mac) column demonstrates the behaviour of the Set Filter in Mac Excel Mode.

Differences Between Modes

The table below shows the differences in behaviour alongside the default behaviour of the grid for comparison. Note that the behaviour of the grid can be changed from the defaults in many ways using the other options detailed on the Set Filter page. These options can also be used in conjunction with the Excel Mode to give you the maximum amount of flexibility.

BehaviourDefaultExcel (Windows)Excel (Mac)
Show all values selected by default
Allow filter with no values selected
Apply the filter immediately when a value is selected/deselected (after 500ms delay)
Apply the filter when the Apply button is clicked (when button enabled)N/A
Close the filter when the Apply button is clicked N/A
Press ↵ Enter to apply the filter N/A
Close the filter when ↵ Enter is pressed
Discard the selected state of values that are not visible when the filter is applied
Hide unavailable values in other Set Filters when a filter is applied
Type into search box to only show values with matching text
Combine selected values from different searches before applying when "Add current selection to filter" is checked
Press ↵ Enter in the search box to apply the filter using all visible values (unless search box is empty)N/A
Apply the filter immediately using all visible values while typing in the search box (after 500ms delay)
Press ↵ Enter in the search box to select all search text
Restore the applied filter state when the search box is cleared N/A
Clear the search box when the filter is closed
Discard un-applied changes when the filter is closed N/A
Discard un-applied changes when the Cancel button is clicked N/A
Close the filter when the Cancel button is clicked N/A
Allow blank values to be selected
Show (Blanks) option at the end of the list of values sorted with other values
The (Blanks) option is shown if the search text matches

Next Up

Continue to the next section to learn about the Set Filter API.