Approach for creating a dialog to act as a shortcut for specifying multiple filter values

[Murray]

I have a kendo grid with many columns, and defining filters in each column header is not the best user experience as it requires lots of scrolling and button clicks to open a dialog per column to define filter parameters. 

 

I have been asked to build a popup dialog which would load the column definitions and then generate a list of the columns and filter operator / filter value widgets so that a user could just open the popup, find the relevant column and then specify the filter operator and values.

Is there any plan to introduce such a feature in the grid soon? The ergonomics of filtering for multiple columns would be much improved with such a widget i think.

If I must roll my own implementation, is there any way I can hook in to the kendo code to build my filter list in a dialog, then apply it to the grid once it closes? How would I go about doing that?

Thanks

[Svet]

Hi Murray,

Thank you for the provided details.

Indeed, at the moment there is no such functionality planned for development as a built-in feature. However it could be achieved using some custom implementation. Let me provide some guidelines. First there should be an array that stores the configuration for each column. That array can be used to create the columns of the Grid and their respective filters, dynamically using Angular's *ngFor directive. Afterwards if at any point the array is updated to contain different settings, the Grid should be re-rendered. Also, in order to pass specific values to the filters, then the value passed to the [filter] input property of the Grid should be updated programmatically when needed. Please check the following example demonstrating that approach:

https://stackblitz.com/edit/angular-2y2maz?file=app/app.component.ts

Basically, on the button click I am modifying manually the filter operator and value for the "City" column and I am applying the filter using the process method. Indeed, the example doesn't represent a provided out-of-the-box functionality, but it should point you in the right direction of achieving the requirement. Please check it and let me know in case there is something unclear or any further assistance is required. Thank you in advance.

Regards,
Svetlin
Progress Telerik