KendoUI DropDown list - Add custom data fields

1
votes

At the moment I can only store 'dataTextField' and 'dataValueField' to a Kendo DropDown list, but I need to be able to store more values for each item in the list.

I populate the Drop downs with JSON data, the JSON array contains multiple properties for each index in the array.

Is there a way to add more values for drop down items (e.g. 'dataCustomField1', 'dataCustomField2', 'dataCustomField3')

2
propertieskendo-uistorekendo-dropdown
Let see if I understand... You want to have more fields for each item but... what do you want to do with them? are they going to be displayed when drop down is open? If so, how do you plan to choose which one to show? – OnaBai

2 Answers

6
votes

I found the solution.

var dropDown = $("#ddList").data("kendoDropDownList"); 
var ddData = dropDown.dataSource.view()[dropDown.selectedIndex - 1];

ddData contains all the JSON of the selected item in the drop Down.

0
votes

I know the above selected answer works but the value you're looking for is already given to you when item is selected in the drop list as below

$('#drop-list').kendoDropDownList({
     dataSource: [{ID: 1, NAME: 'A', dataCustomField1: 'data'}...],
     dataTextField: "NAME",
     dataValueField: "ID",
     change: function(e) {
         var myJsonItem = this.dataItem();          // <---- Here is your json item
         console.log(myJsonItem.dataCustomField1);  // <---- Sample usage
     }
});