Question

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

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

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

如何获取MultiSelect值（所选值的列表/数组）到网格模型中的任何想法？

由于

编辑：我现在使用了一种解决方法，但我很想知道是否有一种“正确的方法”将MultiSelects与网格结合使用。

解决方法是在Grid的配置中添加类似的内容：

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。这似乎有效，我只是不知道为什么有必要。

Answer 1

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

网格编辑器仅支持列string，boolean，number和date的类型。既然你想要保存一个数组...让我们说string你将不得不解决这个问题。
由于您从服务器收到一组值，因此您必须使用template将其序列化为string，以显示从服务器收到的值。
KendoUI无法猜测您是否想要使用MultiSelect作为输入，因此您必须提供editor功能。

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

要解决array string的问题，最简单的解决方案是不要向KendoUI说明接收的内容。

对于template，我将使用JavaScript join方法将所有值拉到一起，用“，”分隔。类似的东西：

{ 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 string，其中包含有效城市的名称。

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

当您更新（保存）时，它会向主持人发送array个字符串，其中包含Cities字段中引入的城市。

示例：此处http://jsfiddle.net/OnaBai/Q2w7z/

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

1 个答案: