Multiselect Group Template

[Erik]

Is there a way to display other datasource fields in a custom groupTemplate?

If i use the below code, i get a undefined error.

groupTemplate: "#: data.aDifferentField#"

The reason i want to do this is because i want to have grouped options in my select list but grouping the data source by the real field doesn't return the order i want.

So i basically use a different field to group the data source and want to display the name of my original grouping field instead.

[Alex Hajigeorgieva]

Hi Erik,

The Kendo UI MultiSelect will show the value of the group in the labels by default as outlined at:

http://docs.telerik.com/kendo-ui/api/javascript/ui/multiselect#configuration-groupTemplate

No other information is available, therefore, you cannot access other fields of the Kendo UI Data Source. To group the items in a different order other than the supported options - ascending/descending, then you should do the custom grouping on the server and enable serverGrouping:

http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-serverGrouping

Alternatively, if you would like to keep your implementation the way it is at the moment, you may create an object with properties (key-value pairs) to act as a switch case in the Kendo UI Template. The property name could be the genuine field which the Kendo UI Data Source is grouped by (i.e the data) and the value should be the custom label you require.

var myData = {
 realFieldValue1: "A",
 realFieldValue2: "B"
};
// MultiSelect
groupTemplate: "#: myData[data] #",

 
For your convenience, I have prepared a runnable demo at:

http://dojo.telerik.com/obInO

Regards,
Author nickname
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.