Change Selected Value Of Kendo Ui Dropdownlist

I have a kendo ui dropdownlist in my view: $('#Instrument').kendoDropDownList({ dataTextField: 'symbol', dataValueField: 'symbol', dataSource: data, index: 0 }); H

Solution 1:

You have to use Kendo UI DropDownList select method (documentation in here).

Basically you should:

// get a reference to the dropdown listvar 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";
});

JSFiddle example here

Solution 2:

The Simplest way to do this is:

$("#Instrument").data('kendoDropDownList').value("A value");

Here is the JSFiddle example.

Solution 3:

Since this is one of the top search results for questions related to this I felt it was worth mentioning how you can make this work with Kendo().DropDownListFor() as well.

Everything is the same as with OnaBai's post except for how you select the item based off of its text and your selector.

To do that you would swap out dataItem.symbol for dataItem.[DataTextFieldName]. Whatever model field you used for .DataTextField() is what you will be comparing against.

@(Html.Kendo().DropDownListFor(model => model.Status.StatusId)
    .Name("Status.StatusId")
    .DataTextField("StatusName")
    .DataValueField("StatusId")
    .BindTo(...)
)

//So that your ViewModel gets bound properly on the post, naming is a bit //different and as such you need to replace the periods with underscoresvar ddl = $('#Status_StatusId').data('kendoDropDownList');    

ddl.select(function(dataItem) {
    return dataItem.StatusName === "Active";
});

Solution 4:

Seems there's an easier way, at least in Kendo UI v2015.2.624:

$('#myDropDownSelector').data('kendoDropDownList').search('Text value to find');

If there's not a match in the dropdown, Kendo appears to set the dropdown to an unselected value, which makes sense.

---

I couldn't get @Gang's answer to work, but if you swap his value with search, as above, we're golden.

Solution 5:

It's possible to "natively" select by value:

dropdownlist.select(1);