0

我有以下用于 Kendo MVVM DropDownList 的 html：

                <select id="responseTypeDDL"
                    data-role="dropdownlist"
                    data-text-field="SystemResponseTypeCode"
                    data-value-field="SystemResponseTypeId"
                    data-bind="value: selectedSystemResponseTypeCode, source: responseTypes">
                </select>

这是我的视图模型：

        SC.ViewModels.Reference.ResponseTypeDataSource.read();

        var responseTypeDDL = kendo.observable({
            responseTypes: SC.ViewModels.Reference.ResponseTypeDataSource,
            selectedSystemResponseTypeCode: null,
            setSelectedSystemResponseTypeCode: function (code) {
                this.selectedSystemResponseTypeCode = code;
            },
        });

        kendo.bind($("#responseTypeDDL"), responseTypeDDL);

        // after reading data, I call the method to set the selected value like this:
        self.ResponseTypeDDL.setSelectedSystemResponseTypeCode(results.code);

ResponseTypeDataSource.read() 方法返回“XML”、“JSON”的列表。这是 SystemResponseTypeCode 字段。我还从数据库中读取了另一个数据项并检查了它的响应类型。假设它是“JSON”。如何设置下拉菜单以选择“JSON”？

4

2 回答 2

2

首先这部分似乎是错误的

setSelectedSystemResponseTypeCode: function (code) {
    this.selectedSystemResponseTypeCode = code;
},

您应该确保set()在修改观察到的变量时调用方法，否则它可能不会更新绑定：

this.set("selectedSystemResponseTypeCode", code);

对于你的实际问题

您需要设置data-value-primitive="true"才能仅使用 id ( Kendo Docs ) (请注意下面的更改，value: selectedSystemResponseTypeId)

<select id="responseTypeDDL"
    data-role="dropdownlist"
    data-text-field="SystemResponseTypeCode"
    data-value-field="SystemResponseTypeId"
    data-value-primitive="true"
    data-bind="value: selectedSystemResponseTypeId, source: responseTypes">
</select>

SC.ViewModels.Reference.ResponseTypeDataSource.read();

var responseTypeDDL = kendo.observable({
    responseTypes: SC.ViewModels.Reference.ResponseTypeDataSource,
    selectedSystemResponseTypeCode: null,
    selectedSystemResponseTypeId: null,
    setSelectedSystemResponseTypeId: function (id) {
        this.set("selectedSystemResponseTypeId", id);
    },
});

kendo.bind($("#responseTypeDDL"), responseTypeDDL);

// Get your id
var id = ...    
responseTypeDDL.setSelectedSystemResponseTypeId(id);

工作示例：http ://dojo.telerik.com/AbIm/8

于 2014-08-15T07:19:03.147 回答
0

我已经设法手动设置下拉列表中的值，而无需诉诸 data-value-primitive="true" 因为我需要访问选定的值并显示其他字段。

这是解决方案：

var id = 1004;
var dataItem = responseTypeDDL.responseTypes.get(id); //get the id in your datasource
responseTypeDDL.set("selectedsystemResponse", dataItem);
于 2015-06-24T07:02:21.417 回答