The problem i am running into is that during the first load of the page i want to read the value from cookies if found, i want to change the theme that was stored in the cookie. not only want to change the them but i also want to select that item in the combo box so that it is in sync with the them that was applied.
How can i select a specific item during initial page load, when i am constructing the combobox ?
$(document).ready(function () {
var initialized = false;
// theme chooser drop-down
var cmb=$(".themeChooser").kendoDropDownList({
dataSource: [
{ text: "Default" },
{ text: "BlueOpal" },
{ text: "Bootstrap" },
{ text: "Silver" },
{ text: "Uniform" },
{ text: "Metro" },
{ text: "Black" },
{ text: "MetroBlack" },
{ text: "HighContrast" },
{ text: "Moonlight" }
],
dataTextField: "text",
dataValueField: "value",
change: function (e) {
$.cookie('selectedTheme', theme);
changeTheme(theme);
}
});
theme = ($.cookie('selectedTheme') || "default").toLowerCase();
//Not sure how to trigger the select of combobox
cmb.value(theme); // no effect
});
Get a reference to the dropdown list
var dropdownlist = $("#Instrument").data("kendoDropDownList");
If you know the index you can use:
// selects by index
dropdownlist.select(1);
If not, use:
// selects item if its text is equal to "test" using predicate function
dropdownlist.select(function(dataItem) {
return dataItem.symbol === "test";
});
check this http://jsfiddle.net/OnaBai/mRmNJ/