Column Filter
Column filters are filters that are applied to the data at the column level. Many column filters can be active (eg filters set on different columns) and the grid will display rows that pass each column's filter.
Column filters are access in the grid UI either in the Column Menu or the Tool Panel.
Access via Column Menu
Access via Tool Panel
You can use the Provided Filters that come with the grid, or you can build your own Filter Components if you want to customise the filter experience to your application.
Example Simple Filters
The example below demonstrates simple filters. The following can be noted:
- Column Athlete has a simple text filter.
- Column Age has a simple number filter.
- Column Date has a simple date filter.
Configuring Filters to Columns
Set filtering on a column using the column definition property filter
. The property can have
one of the following values:
- boolean: Set to 'true' to enable the default filter. the default is Text Filter for ag-Grid Community and Set Filter for ag-Grid Enterprise
- string / component: Provide a specific filter to use over the default filter.
Below shows some column definitions with filters set:
If you want to enable filters on all columns then set a filter on the
Default Column Definition.
The following code snippet shows setting filter=true
for all columns via the
defaultColDef
and then setting filter=false
for the Sport column, so all
columns have a filter except Sport.
Filter Parameters
Each filter can take additional filter parameters by setting colDef.filterParams
.
What parameters each filter type takes is specific to each filter. The parameters for the provided
filters are explained in their relevant sections.
Below shows configuring the text filter on an Athlete column and providing extra filter parameters
(what resetButton
and applyButton
do are explained in
Apply, Clear and Reset Buttons).
Filter Events
Filtering results in the following events getting emitted:
- Filter Changed: Filter has changed and applied by the grid.
- Filter Modified: Filter UI has changed but not necessarily applied. This is useful when using an apply button and you want to know if the filter changed but not applied.
Filtering Animation
To enable animation of the rows after filtering, set grid property animateRows=true
.
Relation to Quick Filter and External Filter
Column filters work independent to Quick Filter and External Filter. If a quick filter and / or external filter are applied along with a column filter, then each filter type is considered and the row will only pass if it passes all three types.
Column filters are tied to a column. Quick filter and external filter are not tied to a column. This section of the documentation talks about column filters only. For quick filter and external filter, see the relevant sections of the documentation.
Provided Filters
There are four provided filters that come with the grid. The provided filters are as follows:
Filter | Description |
---|---|
agNumberColumnFilter | A Number Filter for number comparisons. |
agTextColumnFilter | A Text Filter for string comparisons. |
agDateColumnFilter | A Date Filter for date comparisons. |
agSetColumnFilter | A Set Filter, influenced by how filters work in Microsoft Excel. This is an ag-Grid-Enterprise feature. |
The section Provided Filters for details on using them.