web-dev-qa-db-ja.com

剣道UIドロップダウンリストの選択値を変更する

私のビューには kendo ui dropdownlist があります：

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

JQueryを使用して選択した値を変更するにはどうすればよいですか？私は試した：

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

しかし、期待どおりに機能しません。

javascriptjqueryasp.net-mvckendo-uitelerik
41
anilca

Kendo UI DropDownList selectメソッドを使用する必要があります（ here のドキュメント）。

基本的にあなたがすべきこと：

// get a reference to the dropdown list
var dropdownlist = $("#Instrument").data("kendoDropDownList");

インデックスがわかっている場合は、次を使用できます。

// selects by index
dropdownlist.select(1);

そうでない場合は、次を使用します。

// selects item if its text is equal to "test" using predicate function
dropdownlist.select(function(dataItem) {
    return dataItem.symbol === "test";
});

JSFiddleの例 here

69
OnaBai

これを行う最も簡単な方法は次のとおりです。

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

JSFiddleの例 です。

28
Gang

少なくともKendo UI v2015.2.624では、もっと簡単な方法があるようです：

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

ドロップダウンに一致するものがない場合、Kendoはドロップダウンを未選択の値に設定するように見えますが、これは理にかなっています。

@ Gangの答え を得ることができませんでしたが、彼のvalueをsearchと交換すると、上記のように黄金色になります。

5
ruffin

これは、これに関連する質問の上位の検索結果の1つであるため、Kendo（）。DropDownListFor（）を使用してこの作業を行う方法について言及する価値があると感じました。

テキストとセレクターに基づいてアイテムを選択する方法を除いて、すべてがOnaBaiの投稿と同じです。

そのためには、dataItem。[DataTextFieldName]のdataItem.symbolを交換します。 .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";
});
5
user2958958

値で「ネイティブに」選択することが可能です：

dropdownlist.select(1);
2
HSM