过滤后将 DropDownList 重新绑定到值字段答案

【问题标题】：Rebind DropDownList to value field after filtering过滤后将 DropDownList 重新绑定到值字段
【发布时间】：2015-08-27 13:01:07
【问题描述】：

在过滤然后取消过滤剑道下拉列表之后，视图模型保留最初选择的值，但下拉列表的值有一个空字符串。

这是下拉列表的预期行为吗？我希望小部件与其模型保持同步。如何“重新绑定”下拉列表，以便在过滤后从其视图模型中获取值？

var viewModel = kendo.observable({
    selectedProduct: null,
    products: [
        { id: 1, name: "Coffee" },
        { id: 2, name: "Tea" },
        { id: 3, name: "Juice" }
    ]
});

kendo.bind($("#dropdown"), viewModel);

var ddl = $("#dropdown").getKendoDropDownList();

console.log("viewModel.selectedProduct.id: " + viewModel.selectedProduct.id + ", ddl.value(): " + ddl.value());

ddl.dataSource.filter({field: "id", value: 4});
ddl.dataSource.filter({});

console.log("viewModel.selectedProduct.id: " + viewModel.selectedProduct.id + ", ddl.value(): " + ddl.value());

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <link href="http://cdn.kendostatic.com/2015.2.624/styles/kendo.common.min.css" rel="stylesheet" />  
  <link href="http://cdn.kendostatic.com/2015.2.624/styles/kendo.default.min.css" rel="stylesheet" />  
  <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
  <script src="http://cdn.kendostatic.com/2015.2.624/js/kendo.all.min.js"></script>
  
</head>
<body>
<select id="dropdown" data-role="dropdownlist" data-option-label="Select product..."
  data-value-field="id" data-text-field="name" data-bind="value: selectedProduct, source: products">
</select>
<script>

</script>
</body>
</html>

【问题讨论】：

标签： javascript kendo-ui kendo-datasource kendo-dropdown

【解决方案1】：

这是我重新绑定值的方法。不过，这取决于一些无证剑道的东西，所以我还是更喜欢另一种方式。

var binding = ddl.element.get(0).kendoBindingTarget.toDestroy[0].bindings.value;
var value = binding.source.get(binding.path);
if (value) {
    ddl.value(value.get(ddl.options.dataValueField));
}

【讨论】：