Skip to main content
All docs
V24.1

Column Filter for a Grid Item on the Web

  • 3 minutes to read

Column filters allow users to search data in the Grid item. These filters do not affect data outside the Grid.

The column filter is enabled in the Grid item in the following demo:

Run Demo: Sales Performance

Filter Row

The filter row allows a user to filter data by individual column values.

Open the grid’s Options menu and go to the Column Filter section to get access to the filter row. When the filter row appears, a user can enter the condition in the text box to filter column values:

Web Dashboard - Enabled filter row (text box)

The filter row’s cells can be of different types (for example, text boxes for string and numeric values, calendars for dates, and so on). Refer to the following topic for more information: Filtering and Searching.

In code, set the GridColumnFilterOptions.ShowFilterRow property to true to enable the filter row.

Update Totals

A user can configure a Grid item to reflect changes in column values and recalculate totals based on the applied column filters. Open the grid’s Options menu and go to the Column Filter section to get access to this setting. As a result, the Grid item recalculates totals depending on the applied column filters:

web-dashboard-filter-row-update-totals

In code, set the GridColumnFilterOptions.UpdateTotals property to true to recalculate totals.

Example: Header Filter

The header filter allows users to filter values in an individual column. A user can include or exclude values from the applied filter to show the result.

When a user clicks a header filter icon, a popup menu that contains all unique values of the column is invoked. A user can select or clear the selection in this menu to include or exclude values from the filter:

Grid Item Header Filter

The header filter for the Web Dashboard is disabled (the default setting). Refer to the following example for information on how to allow users to enable the header filter from the Web Dashboard’s UI:

Header Filter UI button group

View Example: ASP.NET Core View Example: ASP.NET MVC View Example: ASP.NET Web Forms View Example: Angular

Limitations

Filter Row Limitations

The following Grid columns do not support the filter row:

A Grid item does not support a filter row for window calculations and calculated fields that use the w-function if the Update Totals option is enabled.

Update Totals Limitations

You cannot enable totals recalculation in OLAP data sources.

Other Limitations

Although column filters within a Grid item are case-insensitive, totals are calculated on the server and their case-sensitivity setting depends on the database settings. If case-sensitivity settings are different, the total value can differ from the Grid’s data. Make sure that the Grid item and the database use the same case-sensitivity settings.