This is a migrated thread and some comments may be shown as answers.

Multi Filterable with client template

2 Answers 314 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Marc
Top achievements
Rank 1
Marc asked on 19 Oct 2016, 03:27 PM

Can I please get an example of how to use the multi-filter option (.Filterable(f => f.Multi(true))) when the column is using a ClientTemplate.

 

WIth the code below I get [Object] [Object] in the column filter drop down. The client template is parse out an array of hyperlinks from the model.

 

 

columns.Bound(e => e.Reports).Title("Open <br />Reports").Filterable(f => f.Multi(true)).Width(120).ClientTemplate("#=openReport(Reports)#");

 

   function openReports(Reports) {
        if (Reports && Reports.length > 0) {
            var result = "";
            var j = Reports.length;
            for (var i = 0; i < j; i++) {
                result += "<a href='" +
                    someServer +
                    "webpage.aspx?someNumber=" +
                     Reports[i].Number +
                    "&Revision=" +
                    Reports[i].Revision +
                    "' target ='_blank'>" +
                    + Reports[i].Number +
                    "-" +
                    Reports[i].Revision +
                    "</a>, ";
            }
            return result.substring(0, result.length - 2);
        } else {
            return "";
        }

    }

2 Answers, 1 is accepted

Sort by
0
Konstantin Dikov
Telerik team
answered on 21 Oct 2016, 10:29 AM
Hello Marc,

The issue that you are experiencing is due to the fact that the column in question is bound to a complex object and filtering is not supported in such scenario. The multi checkbox filtering is supported when the column is bound to a field containing values that could be filtered, which is not the case with complex objects. If you need to enable the filtering you should bound the column to one of the fields of your Reports property:
columns.Bound(e => e.Reports.Number)  for example

Hope this helps.


Regards,
Konstantin Dikov
Telerik by Progress
Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
Shane
Top achievements
Rank 1
commented on 07 Feb 2023, 10:44 PM

Was this ever updated or fixed? Being able to use a complex object instead of a string property seems necessary to be able to use editor templates like dropdownlists within the CRUD interface to support this functionality. I can populate the filter values with the string values that are displayed via the ClientTemplate. Being able to subscribe to the grid filter event and set the dataSource filter seems like it should work but hacky. This becomes especially cumbersome when dealing with multiple filterable columns. I was thinking that using the property would work but then I couldn't add or edit records because the property would be null or undefined. I tried adding default empty string values but was never able to get this way to work either. 
Ivan Danchev
Telerik team
commented on 16 Feb 2023, 01:20 PM

Shane,

There hasn't been a change with regard to the filtering support when it comes to complex objects. The Grid's DataSource supports flat data, which is why some of the functionality such as sorting, filtering, etc. does not work with nested objects. Comparing two objects is a complex task that depends on the use case. You could compare them by a reference, by a certain property, etc.

If the view model contains a property that is an object itself, the recommended approach is to you bind the column to the specific field of that object. You can use a DropDownList in an editor template, to edit the object. We have a sample project in our Github repo, that demonstrates this approach:

https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/grid/enable-operations-for-object-column

The column is declared as follows:

columns.Bound(product => product.Category.CategoryName).EditorTemplateName("DropDownEditor");

The editor template is at the following location: /Views/Shared/EditorTemplates/

0
Karina
Telerik team
answered on 10 Feb 2023, 08:31 AM

Hello Marc,

Thank you for reaching out to us! The responsible product specialist will contact you and advise you on your question below.

Regards, Karina

Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Shane
Top achievements
Rank 1
commented on 10 Feb 2023, 09:34 PM

Did you mean me? :D 
Tags
Grid
Asked by
Marc
Top achievements
Rank 1
Answers by
Konstantin Dikov
Telerik team
Karina
Telerik team
Share this question
or