Applying Filters

This section describes the different ways to apply the four filters provided by the
grid - Text Filter,
Number Filter,
Date Filter
and Set Filter.

Apply, Clear, Reset and Cancel Buttons

Each of the provided filters can optionally include Apply, Clear, Reset and Cancel buttons.

When the Apply button is used, the filter is only applied once the Apply button is pressed. This is useful if the
filtering operation will take a long time because the dataset is large, or if using server-side filtering (thus
preventing unnecessary calls to the server). Pressing <kbd>↵ Enter<kbd> is equivalent to pressing the Apply button.

The Clear button clears just the filter UI, whereas the Reset button clears the filter UI and removes any active
filters for that column.

The Cancel button will discard any changes that have been made in the UI, restoring the state of the filter to match
the applied model.

The buttons will be displayed in the order they are specified in the buttons array.

The example below demonstrates using the different buttons. It also demonstrates the relationship between the buttons
and filter events. Note the following:

• The Athlete and Age columns have filters with Apply and Reset buttons, but different orders.
• The Country column has a filter with Apply and Clear buttons.
• The Year column has a filter with Apply and Cancel buttons.
• The Age and Year columns have closeOnApply set to True, so the filter popup will be closed immediately
  when the filter is applied, reset or cancelled. Pressing <kbd>↵ Enter<kbd> will also apply the filter and close the
  popup.

Note the expected behaviour when clicking the filter popup buttons:

• Apply closes popup only when closeOnApply set to True.
• Reset closes popup only when closeOnApply set to True and Apply button is present.
• Cancel closes popup only when closeOnApply set to True.
• Clear never closes popup.

Provided Filter Params

All the provided filters have the following parameters:

• buttons Specifies the buttons to be shown in the filter, in the order they should be displayed in. The options are:
  • ‘apply’: If the Apply button is present, the filter is only applied after the user hits the Apply button.
  • ‘clear’: The Clear button will clear the (form) details of the filter without removing any active filters on the
    column.
  • ‘reset’: The Reset button will clear the details of the filter and any active filters on that column.
  • ‘cancel’: The Cancel button will discard any changes that have been made to the filter in the UI, restoring the
    applied model.
• closeOnApply (boolean, default: False) If the Apply button is present, the filter popup will be closed immediately when the Apply or
  Reset button is clicked if this is set to True.
• debounceMs (number) Overrides the default debounce time in milliseconds for the filter. Defaults are:
  • TextFilter and NumberFilter: 500ms. (These filters have text field inputs, so a short delay before the input is
    formatted and the filtering applied is usually appropriate).
  • DateFilter and SetFilter: 0ms
• readOnly (boolean, default: False) If set to True, disables controls in the filter to mutate its state. Normally this would be used
  in conjunction with the Filter API. See Read-only Filter UI.