Setting operators for custom filter UI

[Rob]

Hi,

I've created a custom filter UI containing a dropdown list:

Is it possible to just show 'Equal' and 'Not Equal' in the operator dropdown? As the rest are not relevant.

Thanks,

Rob

[Vikram Sundararajan]

Hi Rob,

Greetings from Syncfusion support,

Query: Want to customize the filter menu operator list

We have looked through your request and only wish to display the "equal" and "not equal" operators in the list of filter menu operators. By setting the operators property in filtersettings, you can change the default filter operators list.

For further information, read the documentation, code snippets and sample

Api documentation: https://ej2.syncfusion.com/javascript/documentation/grid/filtering/filter-menu/#customizing-filter-menu-operators-list

[Index.js]

 

filterSettings: { type: 'Menu', operators: {

            stringOperator: [

                    { value: 'equal', text: 'Equal' },

                    { value: 'notEqual', text: 'Not Equal' },

                    ],

                    } },

 

Sample: https://stackblitz.com/edit/rs49jy-dpwmva?file=index.html,index.js

If you require further assistance, please do not hesitate to contact us. We are always here to help you.

Regards,

Vikram S

[Rob]

Thanks Vikram, however I think this applies to the whole grid? Not just the column with the custom filter dropdown?

I don't want to disable these filters for all columns, just for the custom filter dropdown where they're not relevant.

[Vikram Sundararajan]

Hi Rob

Greetings from Syncfusion support,

Query: Want to customize the filter menu operator list for only custom filter UI column

Based on your requirement we have prepared sample in that we have showed only specific operators for Customer Name column for that we have used the actionBegin event. The actionBegin event will triggered with beforefilteropen requestType when click filter icon. In that we have changed the stringOperators for customer Name column.

For further information, read the documentation, code snippets and sample.

Customize filter operator: https://ej2.syncfusion.com/javascript/documentation/grid/filtering/filter-menu/#customizing-filter-menu-operators-list

Custom Component: https://ej2.syncfusion.com/javascript/documentation/grid/filtering/filter-menu/#custom-component-in-filter-menu

actionBegin: https://ej2.syncfusion.com/javascript/documentation/api/grid/#actionbegin

[Index.js]

 

actionBegin:(args)=>{

        if (args.requestType === "filterbeforeopen") { 

            if (args.columnName === "CustomerName" && args.columnType === "string") {

              args.filterModel.customFilterOperators.stringOperator = [];

              args.filterModel.customFilterOperators.stringOperator = [

              { value: "equal", text: "Equal" },

              { value: "notequal", text: "Not Equal" }];

            }

          }

        }

Sample: https://stackblitz.com/edit/rs49jy-dw8kn9?file=index.html,index.js

If you require further assistance, please do not hesitate to contact us. We are always here to help you.

Regards,

Vikram S

[Rob]

Thanks Vikram - that works.

However, it looks like the TypeScript type for args.filterModel is incorrect.

It's typed as CheckBoxFilterBase, which doesn't specify a customFilterOperators property:

https://github.com/syncfusion/ej2-javascript-ui-controls/blob/276ec7f04671932f52ebc86251f1491bc5106b56/controls/grids/src/grid/base/interface.ts#L1634

https://github.com/syncfusion/ej2-javascript-ui-controls/blob/0c3528043cc1218630c71d7374b876acfedfb885/controls/grids/src/grid/common/checkbox-filter-base.ts#L28

In fact the runtime object seems to be a completely different shape to CheckBoxFilterBase:

I've had to work around this by casting the filterModel as any, which obviously isn't ideal.

Please can you look into this?

Thanks,

Rob

[Rob]

It appears the type for FilterSearchBeginEventArgs.filterModel should be FilterMenuRenderer not CheckBoxFilterBase:

https://github.com/syncfusion/ej2-javascript-ui-controls/blob/0c3528043cc1218630c71d7374b876acfedfb885/controls/grids/src/grid/renderer/filter-menu-renderer.ts#L26

[Pavithra Subramaniyam]

Rob,

In EJ2 Grid component, the inbuilt support is available for only customizing the operator list for all the columns using the “filterSettings.operators” property. Since you need to customize the operator for individual column only, we provided the solution as a workaround only. So, we suggest the “any” type for the “filterModel” to overcome the typing issue.

[Rob]

Thanks, ok I'll stick with any here.

Still seems the typing is incorrect for filterModel as the runtime object is completely different to the type.

[Pavithra Subramaniyam]

Hi Rob,

We have confirmed the reported scenario as a bug our side and logged a defect report for the same as “Need to set typing for Menu filterbeforeopen event”. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and will include the defect fix in the April 26^th, 2023 patch release. We appreciate your patience until then.

You can now track the status of your request, review the proposed resolution timeline, and contact us for any further inquiries through the below link.

Feedback:  https://www.syncfusion.com/feedback/42873/need-to-set-typing-for-menu-filterbeforeopen-event

Disclaimer: Inclusion of this solution in the weekly release may change due to other factors including but not limited to QA checks and works reprioritization.

Regards,

Pavithra S

[Rob]

Excellent, thanks Pavithra - look forward to seeing the fix.

[Rob]

Also some of the request action types are incorrect, e.g. filterBeforeOpen (camel case) is actually filterbeforeopen (lower case) at run time:

https://github.com/syncfusion/ej2-javascript-ui-controls/blob/0c3528043cc1218630c71d7374b876acfedfb885/controls/grids/src/grid/base/enum.ts#L50

[Pavithra Subramaniyam]

Rob,

We will also consider this case changes for “filterBeforeOpen” in our defect report. Please track the status of the below feedback.

https://www.syncfusion.com/feedback/42873/need-to-set-typing-for-menu-filterbeforeopen-event

[Pavithra Subramaniyam]

Rob,

Thanks for your patience.

We are glad to announce our weekly patch release (21.2.3) is rolled out. We have included the fix for this “Need to set typing for Menu filterbeforeopen event” issue in this release. So, we suggest you upgrade our Syncfusion packages to our latest version to resolve this issue on your end.

Feedback link: https://www.syncfusion.com/feedback/42873/need-to-set-typing-for-menu-filterbeforeopen-event

Regards,

Pavithra S