Создал простенькую объектную модель с продуктами и категориями:
public class Product
{
public int Id { get; set; }
public string Name { get; set; }
public virtual Category Category { get; set; }
}
public class Category
{
public int Id { get; set; }
public string Name { get; set; }
}
С использованием KendoUI сделал грид для отображения и редактирования продуктов:
$("#productGrid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: {
url: "/odata/Product",
dataType: "json",
data: {
$select: "Id, Name, Category/Name",
$expand: "Category"
}
},
create: {
url: "/odata/Product",
type: "POST",
dataType: "json",
contentType: "application/json"
},
update: {
url: function (data) {
return "/odata/Product(" + data.Id + ")";
},
type: "PUT",
dataType: "json",
contentType: "application/json"
},
destroy: {
url: function (data) {
return "/odata/Product(" + data.Id + ")";
},
type: "DELETE",
dataType: "json"
},
parameterMap: function (options, operation) {
var paramMap = kendo.data.transports.odata.parameterMap(options);
delete paramMap.$format;
if (operation !== "read" && options) {
delete paramMap.$inlinecount;
return JSON.stringify(paramMap);
}
return paramMap;
},
},
schema: {
data: function (data) {
return data.value;
},
total: function (data) {
return data['odata.count'];
},
model: {
id: "Id",
fields: {
Id: { type: "number", editable: false },
Name: { type: "string" },
Category: { defaultValue: { Name: "DefCategory" } },
}
}
},
pageSize: 10,
serverPaging: true,
serverFiltering: true,
serverSorting: true,
serverGrouping: true
},
height: 550,
sortable: true,
editable: "inline",
toolbar: ["create"],
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5,
},
columns: [
{ field: "Name", title: "Name", width: 200 },
{ field: "Category", title: "Categ", template: "#=Category.Name#", editor: categoryEditor },
{ command: ["edit", "destroy"], title: " " },
]
});
Для редактирования категории сделал кастомный эдитор:
function categoryEditor(container, options) {
$('<input required data-text-field="Name" data-value-field="Id" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
dataTextField: "Name",
dataValueField: "Id",
autoBind: false,
dataSource: {
type: "odata",
schema: {
data: "value",
total: "['odata.count']",
model: {
id: "Id",
fields: {
Id: { editable: false, type: "number" },
Name: { type: "string", nullable: false }
}
}
},
transport: {
read: {
url: "/odata/Category",
dataType: "json",
contentType: "appliction/json"
}
}
}
});
}
Обычные текстовые данные успешно изменяются, а вот категория сначала меняется, но после обновления данных, становится видно что в базу новое значение не попало.