Skip to main content Skip to footer

Checking for Active Column Filters in FlexGrid

Getting Active Filter Count

Background:

There are many use cases for when someone would like to know if a column filter is active or how many total active filters there are on their dataGrid. Wijmo's FlexGrid has built in properties and methods to easily achieve this.

 

Steps to Complete:

1. Iterate over columnsCollection and get the column filter using getColumnFilter method

2. Check if the isActive property is on the column filter

3. Combine logic to get the number of columns with an active filter

 

Getting Started:

Iterate over columnsCollection and get the column filter using getColumnFilter method

Using the forEach method on columnCollection you can iterate through your columns to get the filters using getColumnFilter.

grid.columns.forEach((col) => {
    let columnFilter = filter.getColumnFilter(col);
});

 

Check if the isActive property is on the column filter

After getting the column's filters, check if they have the isActive property.

let columnFilter = filter.getColumnFilter(col);
      if (columnFilter.isActive) {
    ...
      }

 

Combine logic to get the number of columns with an active filter

If the column filter contains the isActive property, then increment a variable holding the count to determine the total number of active filters. You can use the alert function to create a popup showing the number.

let count = 0;
    grid.columns.forEach((col) => {
      let columnFilter = filter.getColumnFilter(col);
      if (columnFilter.isActive) {
        count++;
      }
    });
alert(count);

 

And that's it. Now you know how to check if a column filter is active and how to determine how many filters are currently active. A sample app demonstrating this can be found here.
 
Happy coding!

Andrew Peterson

Technical Engagement Engineer