Kendo ui datasource filter multiple values

All Telerik.

This post aims to come up with some useful workaround to filter data in Telerik Kendo Grid over multi-select column fields bound to complex data by using multi-check-boxes filters. I was reading a lot about it in forums but I could not find any solution for me except some that forced me to refactor my code largely. Not funny for me. That having said, on one hand, I couldn't display data values in filter on the target column and on the other hand, once I could find a solution to show multi-check-boxes with desired options, it turns out default functionality did not provide filter capabilities for multi-select fields bound to complex data. It would come very handy if someone reading this post could tell me I am wrong and even leading me to some link explaining how to do it They are columns showing multiple elements for the same column or field, for instance, a list of products as displayed below. This can be achieved very easily with Telerik Kendo grid.

Kendo ui datasource filter multiple values

.

Not only end-users can see the list but performing CRUD actions as well in case of building the application to meet that functionality. For instance, the Product one is only a class to store typical data for products such as ProductId and ProductName.

.

All Telerik. Now enhanced with:. To try it out sign up for a free day trial. The jQuery Filter control is a powerful component, which allows you to create a filter that can be used by the Kendo DataSource. It provides an intuitive UI and a variety of options about how to create the underlying filter expression. You can apply the filter to the data source by clicking the built-in Apply button or manually by using the applyFilter method. The Filter supports editors customization in the form of templates.

Kendo ui datasource filter multiple values

All Telerik. Now enhanced with:. The logic operator is determined by the parent composite descriptor. It should be set explicitly. UI for.

Dancing bear x video

As a workaround, users can click "Clear" button and actions will be performed fine but I wanted filters to work fine in both situations. This way, the grid can show product names and store internally product codes that we can use in the front-end or even send to the back-end according to rest of grid configuration. UI for. That having said, on one hand, I couldn't display data values in filter on the target column and on the other hand, once I could find a solution to show multi-check-boxes with desired options, it turns out default functionality did not provide filter capabilities for multi-select fields bound to complex data. Submit comment. Finally, notice that I am making use of a custom removeFilter javascript function in order to remove filters as needed:. It let us store or attach arbitrary data associated with any DOM Document Object Model element and then, return those previously-stored data. Sort by Score Date. It is odd. Submit answer.

By default, no filter is applied.

In other words, maybe we need to filter elements that contain ["Chai" and "Chang"] products or perhaps only elements that contains ["Chai" or "Chang"] items. Sort by Score Date. Notify me when new comments are added. So, with ClientTemplate method, we can provide a template to make use of MultiSelect functionality in order to set the data text and value fields from the underlying model. The aim of this column is to apply in a silent way the selected filter values in the multi-check-boxes filter so that it works fine yet unnoticed for the end user. To begin with, let me first reminder you the basic use of. Browse for files to attach Desktop UI for. Please, review the jQuery API for more details. The former let us attach data based on a key string value and the latter via an object that must contain key-value pairs. The appli You can configure this as you best think it meets your requirements. Not funny for me.