【问题标题】:Why does the KendoUI Grid not rollback a delete when the options.error function is called?为什么调用 options.error 函数时 KendoUI Grid 不回滚删除?
【发布时间】:2013-05-08 08:23:19
【问题描述】:

我在这里放了一个小提琴来演示这个问题。

http://jsfiddle.net/codeowl/fmzay/1/

只需删除一条记录,它应该回滚删除,因为我从destroy函数内部调用options.error。

为什么网格不回滚?

问候,

斯科特

标记:

<div id="KendoGrid"></div>

JS:

var _data = [
        { Users_ID: 1, Users_FullName: 'Bob Smith', Users_Role: 'Administrator'  },
        { Users_ID: 2, Users_FullName: 'Barry Baker', Users_Role: 'Viewer'  },
        { Users_ID: 3, Users_FullName: 'Bill Cow', Users_Role: 'Editor'  },
        { Users_ID: 4, Users_FullName: 'Boris Brick', Users_Role: 'Administrator'  }
    ],
    _dataSource = new kendo.data.DataSource({ 
        data: _data,
        destroy: function (options) {
            options.error(new Error('Error Deleting User'));
        }
    });

$('#KendoGrid').kendoGrid({
    dataSource: _dataSource,
    columns: [
        { field: "Users_FullName", title: "Full Name" },
        { field: "Users_Role", title: "Role", width: "130px" },
        { command: ["edit", "destroy"], title: "&nbsp;", width: "180px" }
    ],
    toolbar: ['create'],
    editable: 'popup'
});

【问题讨论】:

  • 你确定你的destroy函数被调用了吗?
  • 好电话。好的,我已经修改了它,现在它被调用了。但仍然是相同的行为,没有回滚,而且如果您删除多个记录,销毁事件会引发太多次...jsfiddle.net/codeowl/fmzay/2

标签: kendo-ui datasource kendo-grid


【解决方案1】:

发出错误信号是不够的。假设在删除记录时出现错误是不够的,因为 KendoUI 不知道记录是否实际上已在服务器中删除,并且回复是产生错误的那个。所以 KendoUI 方法是一种保守的方法:你必须决定要做什么并明确地说出来:

所以你应该做的是添加一个error处理函数,在网格中调用cancelChanges

代码是:

_dataSource = new kendo.data.DataSource({
    transport: {
        read: function(options) {
            options.success(_data);
            console.log('Read Event Has Been Raised');
        },
        destroy: function (options) {
            options.error(new Error('Error Deleting User'));
            console.log('Destroy Event Has Been Raised');
        }
    },
    schema: {
        model: {
            id: "Users_ID",
            fields: {
                Users_ID: { editable: false, nullable: true },
                Users_FullName: { type: "string", validation: { required: true } },
                Users_Role: { type: "string", validation: { required: true } }
            }
        }
    },
    error: function(a) {
        $('#KendoGrid').data("kendoGrid").cancelChanges();
    }
});

更新的 JSFiddle 在这里:http://jsfiddle.net/OnaBai/fmzay/3

【讨论】:

  • 很棒的伙伴。现在为什么 Destroy 事件被触发了这么多次......每次我按下 Delete 按钮,它都会被触发一次。看看控制台看看我的意思:jsfiddle.net/codeowl/fmzay/5
  • 这实际上是那个版本的一个错误。如果你检查最新的,你会发现它可以工作jsfiddle.net/OnaBai/fmzay/6
  • 啊,是的,我一定是从一个老小提琴开始的。这太棒了。再次感谢您的支持。非常感谢!
  • 不需要选择剑道网格。参考在那里:this.cancelChanges();
【解决方案2】:

OnaBai 答案的 ASP.NET-MVC 等效解决方案是:

<script type="text/javascript">
function cancelChanges(e) {
    e.sender.cancelChanges();
}
</script>

@Html.Kendo().Grid<MyClass>()
.DataSource(dataSource =>
    dataSource
    .Ajax()
    .Read(read => read.Action("Read", "MyController"))
    .Destroy(destroy => destroy.Action("Destroy", "MyController"))
    .Events(evt => evt.Error("cancelChanges"))
)
[...]

请注意,cancelChanges 事件将在每个 CRUD 请求出现错误时被调用。

【讨论】:

  • 不错。使用“e.sender”比在接受的答案中使用 jquery 获取对网格的引用要好。
  • @AugustoBarreto: e.sender 指的是数据源,而不是网格。网格位于e.sender.options.table.parent('div')[0],看起来也好不到哪里去;)
  • @mrmashal 对。谢谢!
猜你喜欢
  • 1970-01-01
  • 2015-01-15
  • 1970-01-01
  • 1970-01-01
  • 2020-05-13
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-09-03
相关资源
最近更新 更多