jQuery 更改剑道ui下拉列表的选定值

Change selected value of kendo ui dropdownlist

提问by anilca

I have a kendo ui dropdownlistin my view:

我有一个剑道用户界面下拉列表：

$("#Instrument").kendoDropDownList({
    dataTextField: "symbol",
    dataValueField: "symbol",
    dataSource: data,
    index: 0
});

How can I change the selected value of it using jQuery? I tried:

如何使用 jQuery 更改它的选定值？我试过：

$("#Instrument").val(symbol);

But it doesn't work as expected.

但它没有按预期工作。

回答by OnaBai

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

您必须使用 Kendo UI DropDownListselect方法（此处的文档）。

Basically you should:

基本上你应该：

// 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";
});

JSFiddle example here

JSFiddle示例在这里

回答by Gang

The Simplest way to do this is:

最简单的方法是：

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

Here is the JSFiddle example.

这是JSFiddle 示例。

回答by user2958958

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.

由于这是与此相关的问题的顶级搜索结果之一，因此我觉得值得一提的是如何使用 Kendo().DropDownListFor() 也可以使此工作正常进行。

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

除了您如何根据文本和选择器选择项目之外，一切都与 OnaBai 的帖子相同。

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.

为此，您需要将 dataItem.symbol 换成 dataItem.[DataTextFieldName]。无论您用于 .DataTextField() 的模型字段是什么，您都将与之进行比较。

@(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 underscores
var ddl = $('#Status_StatusId').data('kendoDropDownList');    

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

回答by ruffin

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

似乎有一种更简单的方法，至少在 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.

如果下拉列表中没有匹配项，Kendo 似乎将下拉列表设置为未选中的值，这是有道理的。

---

---

I couldn't get @Gang's answerto work, but if you swap his valuewith search, as above, we're golden.

我无法得到@Gang 的工作答案，但是如果您将他的value与交换search，如上所述，我们就是黄金。

回答by HSM

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

可以按值“本地”选择：

dropdownlist.select(1);