如何编辑剑道网格数据源对象

我的观点如下：

 columns.Bound(o => o.line.ApprovalBy.UserDisplayName)
 columns.Bound(o => o.line.ItemNumber)

使用 JQuery，我能够使用以下方式编辑项目编号行：

('#grid').data('kendoGrid').dataSource.at(0).line.ItemNumber = 155

但是，当我尝试编辑默认情况下设置为null的批准方式时，如下所示：

('#grid').data('kendoGrid').dataSource.at(0).line.ApprovalBy = {UserID: 50}

出于某种原因，它在网格中返回"未定义"。当我尝试编辑以前已初始化的对象时，它将能够工作：

columns.Bound(o => o.line.Vehicle.Color);
('#grid').data('kendoGrid').dataSource.at(0).line.Vehicle.Color = "red";

我错过了什么？

也许这个例子会对你有所帮助

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Kendo UI Snippet</title>
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.408/styles/kendo.common.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.408/styles/kendo.rtl.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.408/styles/kendo.default.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.408/styles/kendo.dataviz.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.408/styles/kendo.dataviz.default.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.408/styles/kendo.mobile.all.min.css">
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://cdn.kendostatic.com/2015.1.408/js/kendo.all.min.js"></script>
</head>
<body>
  
<div id="grid"></div>
<script>
 $("#grid").kendoGrid({
	selectable: "multiple cell",
	allowCopy: true,
	columns: [{
		field: "productName"
	}, {
		field: "category"
	}, {
		field: "a.id"
	}, {
		field: "a.name"
	}],
	dataSource: [{
		productName: "Tea",
		category: "Beverages",
		a: {
			id: 1,
			name: "1"
		}
	}, {
		productName: "Coffee",
		category: "Beverages",
		a: {
			id: 2,
			name: "2"
		}
	}, {
		productName: "Ham",
		category: "Food",
		a: {
			id: 3,
			name: "3"
		}
	}, {
		productName: "Bread",
		category: "Food",
		a: {}
	}]
});
$(document).ready(function() {
	var grid = $("#grid").data("kendoGrid");
	var dataSource = grid.dataSource;
	dataSource.at(0).productName = "Tet";
	dataSource.at(3).a = {
		id: 4,
		name: "4"
  };
	grid.setDataSource(dataSource);
});
  
</script>
</body>
</html>

相关内容

最新更新

热门标签：