Defining Columnn Filters
Column Filters
Column Filters are defined in the view.filters.columns property of the Adaptable State.
They are automatically evaluated by AdaptableQL.
You can define Filters on multiple columns in Infinite Table.
Hint
- If you need multiple filters on the same column, you should use the Grid Filter
- Alternatively, you can define custom filter functions which can use your own logic
In this demo, we define Column Filters on the stars and the license columns.
const defaultState: AdaptableUserState = {
globalEntities: {
// ...
},
view: {
currentViewId: 'myView',
views: [
{
id: 'myView',
label: 'My View',
filters: {
columns: [`[stars] > 40000`, `[license] CONTAINS "MIT"`],
},
},
],
},
};Based on the AdaptableQL Expression, AdapTable will know which columns to show as filtered.
Note
- Each Expression should reference only one column
- If you need more columns, then use a grid filter.
Custom Filter Functions
You can define your own filter functions that can be used in the column filters, by using the globalEntities.customFilters property in state.
const state: AdaptableUserState = {
globalEntities: {
customFilters: {
POPULARITY: {
label: 'Popularity',
scope: {
columns: ['github_stars'],
},
operator: {
icon: () => <> * </>,
editor: PopularityFilterEditor,
handler: ({ currentValue, filterValue }) => {
return currentValue >= filterValue;
},
},
},
},
},
};The above filter makes the POPULARITY function available in the column filters.
const state: AdaptableUserState = {
view: {
currentViewId: 'myView',
views: [
{
id: 'myView',
label: 'My View',
filters: {
columns: [`POPULARITY([github_stars], 45000)`],
},
},
],
},
};The above snippet will make the DataGrid only show rows where the github_stars column is greater than or equal to 45.000.
Defining a custom filter function
In this demo, we define a custom filter called POPULARITY that can be used in the github_stars column.