Kendo ui 剑道网格更改指示器和取消不工作

我是剑道和剑道网格的新手，但我正在尝试学习如何使用主细节剑道网格，其中细节网格应该支持批量编辑。数据在本地JavaScript对象中可用

展示了我所看到的问题

下面是如何创建网格的——完整的代码片段请参见JSFIDLE-

$（“#网格”）.kendoGrid({
数据源：项目，
detailInit:createDetail，
栏目：[
{字段：“项”，宽度：“200px”}，
]
});
函数createDetail（e）{
$("")
.appendTo（如detailCell）
肯多格里德先生({
数据源：{
批次：对，
运输：{
阅读：功能（选项）{
选项。成功（如数据子项）；
}
}
},
是的，
pageable:对，
工具栏：[“保存”、“取消”]，
栏目：[
{字段：“子项目”，标题：“子项目”，宽度：200}，
{字段：“标题1”，标题：“标题1”，宽度：100}
]
});
}

当您在网格中编辑一个项目并单击下一个单元格时，详细信息网格将自动折叠，无论我在何处单击，即使是在相邻的单元格中。当我再次打开它时，我在单元格中看不到变化指示器（红色缺口），但新值在那里。 如果我将save连接到ajax调用，那么Kendo会发送正确的编辑细节项

单击“取消更改”时不会发生任何事情

如何使网格不崩溃并看到变化指标

如何取消更改才能正常工作

---

[更新]-进一步的调查显示，如果我使用较旧的剑道版本2011.3.1129，这将按预期工作。但如果我使用较新的2012.3.1114，它不会。不知道这是错误还是行为上的改变。

经过努力，我发现原因似乎是主网格自动重新绑定导致了我观察到的行为。我可以通过在主网格中处理数据绑定事件来解决这个问题，并在主网格中检查是否有任何细节数据源是脏的，如果是，则调用preventDefault

以下是相关的代码片段：

    dataBinding: function (e) {
               if (masterGrid.AreChangesPending()) {
                   e.preventDefault();
               } 
    }

    AreChangesPending : function () {
        var pendingChanges = false;
        // I gave each detail div an id so that I can get a "handle" to it 
        $('div[id^="detail_"]').each(function (index) {
            var dsrc = $(this).data("kendoGrid").dataSource;
            $.each(dsrc._data, function () {
                if (this.dirty == true || this.isNew()) {
                    pendingChanges = true;
                }
            });

            // For some reason, Kendo did not detect new rows in the isNew() 
            // call above, hence the check below
            if (dsrc._data.length != dsrc._total) {
                pendingChanges = true;
            }
        });

        return pendingChanges;
    }

    dataBinding: function (e) {
               if (masterGrid.AreChangesPending()) {
                   e.preventDefault();
               } 
    }

    AreChangesPending : function () {
        var pendingChanges = false;
        // I gave each detail div an id so that I can get a "handle" to it 
        $('div[id^="detail_"]').each(function (index) {
            var dsrc = $(this).data("kendoGrid").dataSource;
            $.each(dsrc._data, function () {
                if (this.dirty == true || this.isNew()) {
                    pendingChanges = true;
                }
            });

            // For some reason, Kendo did not detect new rows in the isNew() 
            // call above, hence the check below
            if (dsrc._data.length != dsrc._total) {
                pendingChanges = true;
            }
        });

        return pendingChanges;
    }