我正在使用this page上提供的Telerik示例在Kendo UI网格中进行内联编辑,我想将“Categories”列中的内联下拉列表绑定到JSON对象而不是使用他们在演示中使用的xml数据。当我使用JSON数据时,下拉列表不起作用。如何将JSON对象绑定到内联下拉列表?A fully working fiddle can be found here。
这是绑定数据源的JavaScript函数。
function categoryDropDownEditor(container, options) {
var categories = {
'Category': [
{ 'CategoryName': 'Beverages', 'CategoryID': 1 },
{ 'CategoryName': 'Condiments', 'CategoryID': 2 },
{ 'CategoryName': 'Confections', 'CategoryID': 3 },
{ 'CategoryName': 'Dairy Products', 'CategoryID': 4 },
{ 'CategoryName': 'Grains/Cereals', 'CategoryID': 5 },
{ 'CategoryName': 'Meat/Poultry', 'CategoryID': 6 },
{ 'CategoryName': 'Produce', 'CategoryID': 7 },
{ 'CategoryName': 'Seafood', 'CategoryID': 8 }
]
};
$('<input required data-text-field="CategoryName" data-value-field="CategoryID" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: false,
dataSource: categories
});
}
答案 0 :(得分:0)
尝试更改以下内容。
var Category =
[
{ 'CategoryName': 'Beverages', 'CategoryID': 1 },
{ 'CategoryName': 'Condiments', 'CategoryID': 2 },
{ 'CategoryName': 'Confections', 'CategoryID': 3 },
{ 'CategoryName': 'Dairy Products', 'CategoryID': 4 },
{ 'CategoryName': 'Grains/Cereals', 'CategoryID': 5 },
{ 'CategoryName': 'Meat/Poultry', 'CategoryID': 6 },
{ 'CategoryName': 'Produce', 'CategoryID': 7 },
{ 'CategoryName': 'Seafood', 'CategoryID': 8 }
];
并且作为数据源使用
$('<input required data-text-field="CategoryName" data-value-field="CategoryID" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: false,
dataSource: Category
});
答案 1 :(得分:0)
function categoryDropDownEditor(container, options) {
var categories = {
'Category': [
{ 'CategoryName': 'Beverages', 'CategoryID': 1 },
{ 'CategoryName': 'Condiments', 'CategoryID': 2 },
{ 'CategoryName': 'Confections', 'CategoryID': 3 },
{ 'CategoryName': 'Dairy Products', 'CategoryID': 4 },
{ 'CategoryName': 'Grains/Cereals', 'CategoryID': 5 },
{ 'CategoryName': 'Meat/Poultry', 'CategoryID': 6 },
{ 'CategoryName': 'Produce', 'CategoryID': 7 },
{ 'CategoryName': 'Seafood', 'CategoryID': 8 }
]
};
$('<input required data-text-field="CategoryName" data-value-field="CategoryID" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: false,
dataSource: categories.Category
});
}
看看上面的内容,您需要使用属性绑定到数据源。由于kendo数据源是一个Array对象。