4

我正在使用 Kendo UI Grid。这是我的代码：

<body>
<div id="myGrid"></div>

<script type="text/javascript">
$(function(){
    var rows =  [
    {name: "name001", id: "001", group: "G1"},
    {name: "name002", id: "002", group: "G1"},
    {name: "name003", id: "003", group: "G2"},
    {name: "name004", id: "004", group: "G2"},
    ];

    var myDataSource =
        new kendo.data.DataSource({
            data: rows,
            pageSize: 3,
        });

    myDataSource.read();
    $("#myGrid").kendoGrid({
        dataSource: myDataSource,
        columns: [
            {field:"name", title:"The Name"},
            {field:"id", title:"The Id"},
            {field:"group"},
            {command:["edit", "destroy"]}
            ],
        scrollable: false,
        pageable: true,
        sortable: true,
        groupable: true,
        filterable: true,
        editable: "inline"
    });

});
</Script>
</body>

但编辑不起作用。在浏览器中打开这个网格会给我一个看起来与预期一样的网格，带有一个编辑和一个删除按钮。我可以使用删除按钮删除行。但是单击编辑会将行更改为编辑模式（在单元格中输入字段），但更改值并按下更新按钮不会执行任何操作。该行仍处于编辑模式，并且“更新”按钮不会按预期切换回“编辑”。你能告诉我缺少什么吗？我是否必须以某种方式配置我的数据源？

4

1 回答 1

9

是的，您错过了配置 Grid 的数据源以了解如何更新记录。我假设您只想在本地（在客户端）编辑记录-而不将它们发送到服务器。要真正关闭网格并应用更改，您可以使用网格的保存事件和刷新方法。

这是一个带有您案例的jsbin 。

如果您想将这些更改保存到服务器，我建议您从演示开始。

于 2012-11-08T20:43:18.543 回答