使用 MultiSelect 具有自定义弹出编辑器的 Kendo Grid - 无法获取模型中的选定项目

所以标题几乎说明了一切。我正在尝试将新的 MultiSelect 小部件合并到网格的自定义弹出编辑器模板中。

我正在使用数据属性初始化方法并从远程数据源读取下拉选项。这一切都工作正常，但我无法将所选项目的值放入模型中。

当我保存行时，数据数组将发送到服务器，表示在 MultiSelect 中选择的第一个数据项，而不是以逗号分隔的选定值列表。

有什么想法如何将 MultiSelect 值（所选值的列表/数组）放入网格模型中？

Thanks

编辑：我现在使用了一种解决方法，但我有兴趣知道是否有“正确的方法”来使用网格的多重选择。

解决方法是将这样的内容添加到网格配置中：

save: function(e) { 
    e.model.items = $('#select_items').data("kendoMultiSelect").value();
}

这是弹出编辑器模板的相关部分：

<input name="select_items" id="select_items" data-value-field="id" 
data-text-field="description" data-source="itemsDataSource" 
data-role="multiselect" data-auto-bind="false" data-item-template="itemList">

我没有select_items在模型定义中：我使用上面的解决方法将 MultiSelect 的值复制到items这是模型中的。这似乎有效，我只是不知道为什么有必要。

用于使用MultiSelect在网格中，有几个问题需要考虑：

1. 网格编辑器仅支持列类型string, boolean, number and date。因为你想要保存一个数组......让我们说string你必须解决这个问题。
2. 由于您正在从服务器接收值数组，因此您必须使用template将其序列化为string为了显示从服务器接收到的值。
3. Kendo UI 无法猜测您想要使用多选作为输入，因此您必须提供和editor功能。

让我们解决所有这些问题：

为了解决以下问题array of string最简单的解决方案是不对 KendoUI 说出任何有关接收内容的信息。

For the template，我将使用 JavaScriptjoin方法将所有值放在一起，并用“，”分隔。就像是：

{ field: "Cities", template: "#= Cities.join(', ') #" }

最后对于编辑器，我使用：

{ field: "Cities", template: "#= Cities.join(', ') #", editor : citiesEditor }

function citiesEditor(container, options) {
    $("<select multiple='multiple' data-bind='value : Cities'/>").appendTo(container).kendoMultiSelect({
        dataSource: citiesDS
    });
}

在我的情况下哪里citiesDS只是一个array of string带有有效城市的名称。

var citiesDS = [
    "Boston", "Kirkland", "London", "New York", "Philadelphia", "Redmond", "Seattle", "Tacoma"
];

当您更新（保存）时，它会向主机发送一个array包含城市的字符串Cities field.

示例：这里http://jsfiddle.net/OnaBai/Q2w7z/ http://jsfiddle.net/OnaBai/Q2w7z/