在 Kendo DropDownList 中按值设置选定的选项答案

【问题标题】：Set the selected option by value in the Kendo DropDownList在 Kendo DropDownList 中按值设置选定的选项
【发布时间】：2015-06-14 23:31:06
【问题描述】：

我的 html 中有一个带有 angularjs 的剑道 ui 下拉列表：

<select kendo-drop-down-list="dropdownlistCatalogs" k-options="optionsDropDownListCatalogs" data-role="dropdownlist" style="display: none;">
   <option value="2" selected="selected">Test1</option>
   <option value="3">Test2</option>
   <option value="4">Test3</option>
</select>

在 angularjs 控制器中，每次我点击下拉列表中的项目时，我都会调用此函数从下拉控件中删除所选项目：

function removeItemFromDropDown(e) {
   var index = e.item.index();
   var selectedItem = $scope.dropdownlistCatalogs.dataItem(e.item.index());
   $scope.optionsDropDownListCatalogs.dataSource.remove(selectedItem);
}

现在，我想将所选选项设置为不存在的项目以显示空值。

我试过了：

$scope.dropdownlistCatalogs.value(-1);

但不工作

如何通过 value() 设置下拉列表？

【问题讨论】：

标签： angularjs kendo-ui kendo-dropdown

【解决方案1】：

我不太确定 angularjs 以及情况是否不同。我在那里看到$scope，我猜它是有角度的，因为我没有看到它在任何地方定义。但是如果使用 jquery，通常value 会帮助你解决这个问题

在顶部添加一个默认的空白值id:-1，并将默认值设置为1。

单击按钮时，您可以将值更改为 -1

看起来像这样：

var data = [
    { "text": "" , id: -1 }, 
    { "text": "aaa",id: 1 },
    { "text": "bbb",id: 2 },
    { "text": "ccc", id:3}
];

$("#ddl").kendoDropDownList({
    dataTextField: "text",
    dataValueField: "id",
    dataSource: data,
    index: 3
});

$("#button").on("click", function ()  {

    var dropdownlist = $("#ddl").data("kendoDropDownList");

    dropdownlist.value(-1);
});

Here is an working example

【讨论】：