KendoUI 网格:自定义下拉列表提供程序在视图模式下不显示任何文本

Question

我正在使用剑道UI v2016.3.1118作为我的Web应用程序。

我使用剑道 UI 网格中(mode: “incell”)的编辑功能。我创建了一个用于编辑文本框、日期和数值的网格，它工作正常。 我现在要做的是对具有下拉值的列应用编辑。

我已经集成了一个自定义下拉列表提供程序，如 Telerik 示例(https://demos.telerik.com/kendo-ui/grid/editing-custom，演示：https://dojo.telerik.com/UjAGU)中所述。

到目前为止，效果很好。 但是，在我更改下拉列表中的值并且单元格失去焦点后，显示将切换回视图模式。它只在单元格的左上角出现一个小红色指示器，表示该值已更改(单元格为"脏")。除红色指示器外，单元格为空(单元格中不显示任何值)。

就我而言，我的数据源中只有下拉外语类型的列的数字(外键)值。

我的数据源如下所示：

{
Product ID: 1,
ProductName: "Chai",
Category: 1
}

Telerik 提供的示例中的数据源：

{
Product ID: 1,
ProductName: "Chai",
Category: {
CategoryID: 1,
CategoryName: "Beverages",
Description: "Soft drinks, coffees, teas, berries, and ales"
}
}

我尝试将单元格值设置为下拉列表的选择事件中的选定文本。尽管如此，在查看模式下仍然没有为下拉列表显示文本。不幸的是，我找不到合适的活动。事件closeCell永远不会在我的星座中抛出。

有什么想法吗？ 问候 斯特凡

Answer 1

我认为您的问题可能源于您进行选择时 dropDownList 返回的内容(即整个对象，带有文本和值)与网格模型对象所需的内容(仅值)之间的差异。

假设您有一个函数来创建编辑器，就像您引用的示例中的编辑器一样，您能否尝试更改它以将 valuePrimitive 属性设置为 true？

function categoryDropDownEditor(container, options) {
$('<input required name="' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
valuePrimitive: true,
autoBind: false,
dataTextField: "CategoryName",
dataValueField: "CategoryID",
dataSource: {
type: "odata",
transport: {
read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Categories"
}
}
});
}

根据文档：

如果设置为 true，则"视图模型"字段将使用所选物料值字段进行更新。如果设置为 false，则"视图模型"字段将使用所选项目进行更新。

希望这将解决您的问题。