Filter Options Demo

There are many options available for managing Filters in AdapTable via the Filter Options class. These include:

  • Auto Apply Filter

    By default AdapTable will apply the column filters immediately after it is created or an in item in the filter value list is selected or unselected.

    However sometimes this is not the desired behaviour, particularly if you are filtering on the server and want to make one call at the end after all filters have been selected.

    In this case, set autoApplyFilter to false - as done here - and a button appears in each column filter: the filter is only applied when it is clicked.

  • Quick Filter Trigger

    The Quick Filter menu will normally open when the mouse hovers over the menu on the left of any Quick Filter Bar column.

    If Filters are used rarely this can be distracting; setting quickFilterTrigger to 'click' - as done here - ensures the menu only opens (and closes) when explicitly clicked.

  • sortColumnValuesInFilter

    By default the Column Values that are listed in the Filter pane are the distinct values in that column sorted in a default way i.e. alphabetically, lowest to highest etc.

    Setting sortColumnValuesInFilter to true will ensure that column values will display according to the current sorting set for that column.

    Here we set Order Date to sort in descending order (newest to oldest); this same sorting order is reflecting in the filter form for the column that displays distinct values.

  • Clear Filters On StartUp

    Column Filters - like all other changes made in AdapTable are automatically stored in AdapTable State and then available when the grid re-opens.

    If this behaviour is not required, then setting clearFiltersOnStartUp in to true will clear any Column Filters that have been saved.

    This has been done here - so if you create a column filter and reload the page the filter will not reappear when the page loads.

  • Default Filter Predicates

    AdapTable sets default predicates to use for each column data type. These are the ones that appear when no filter is applied.

    By default they are: Numeric Columns: 'Equals'; String Columns: 'Contains'; Date Columns:'On'.

    In this example we have set these 3 values to GreaterThan', 'StartsWith', and 'NotOn' respectively, and the Quick Filter changes accordingly.

AdapTable Help Resources:

Generating dummy data, please wait ...