Hi Sachin,
Greetings from Syncfusion support.
Based on the query we would like to let you know that the Grid’s filtering functionality works on basis of comparing the filtered value with the corresponding column field data in the underlying data source bound to the grid. So the filter dialog renders the corresponding column values as checkbox list. This is the default behavior.
However you can achieve your requirement by setting custom data source to the required column and use ‘contains’ filter operator to filter the column values. We have explained this in detail below,
Initially set the filter data as custom data source to the checkbox filter for the required column by assigning filter data source to the filter model in the Grid’s actionBegin event handler.
|
constructor() {
super(...arguments);
// ‘Labels’ here is the column field where custom data source is to be set
this.filterData = [
{ Labels: 'Label1' },
{ Labels: 'Label2' },
{ Labels: 'Label3' },
{ Labels: 'Label4' },
{ Labels: 'Label5' }
];
}
// Grid’s actionBegin event handler
actionBegin(args) {
if (args.requestType === 'filterbeforeopen' && args.columnName === 'Labels') {
// Modifying filter datasource
args.filterModel.options.dataSource = this.filterData;
}
} |
Then modify the filter operator as ‘contains’ for this column model alone in the Grid’s actionBegin event handler to filter the matching values.
|
// Grid’s actionBegin event handler
actionBegin(args) {
// Check if the required column is getting filtered
if (args.requestType === "filtering" && args.currentFilteringColumn === "Labels") {
// Filter operator is changed for the ‘Labels’ column in the filter columns model
args.columns.forEach(col => {
if (col.field === "Labels")
col.operator = "contains"
})
}
} |
We have prepared a sample based on this for your reference. You can find it below,
Note: On using this approach, the custom filter data source set column will not display any data in the checkbox filter when checking after applying filter for other columns. This is because the checkbox filter list will be generated based on the previous filter predicates.
Please get back to us if you require any further assistance.
Regards,
Sujith R
