敲除Kendo网格dataBound事件

Question

我有一个使用击倒剑道集的kendo网格。

我在网格的一列中有几个自定义按钮，即对另一个div中的一个条目进行ajax调用，删除一个或检查一个editId调用一个函数。我的问题是，，这两个事件都触发了两次！另外，对我来说，dataBound事件和dataBinding事件是一样的。

这里是一个小提琴

this.dataBound = function(){
    alert('dataBound');
};

this.dataBinding = function(){
    alert('dataBinding');
};

我尝试了一些不同的方法。

这是另一个小提琴

this.gridConfig = {
    data: self.myData,
    datasource: {
        data: 'data'
    },
    dataBound: function(){
        alert('dataBound');
    },
    dataBinding: function(){
        alert('dataBinding');
    },
};

事件在网格绑定和数据绑定时触发。但是，当所有的数据都存在的时候，我如何才能确定只得到一个事件呢？

有人知道那里发生了什么吗？顺便说一句，我使用映射插件。

Answer 1

dataBound事件由于不同的原因而触发。当它第一次触发时，如果您console.log()事件，您将看到：

• e.sender._data是一个空数组[]
• e.element[0]是div.k-grid.k-widget

当事件再次触发时，相同的属性显示为：

• e.sender._data是一个长度为3的数组，包含如下：{ color: "green", name: "apple", uid: "..." }之类的项
• e.element[0]是div.k-grid.k-widget (相同的元素)

这似乎意味着网格实际上是将数据绑定到自身两次。

如果我不得不猜测，KO的ko.applyBindings(new ViewModel());将初始化对象并触发事件。之后，当kendo试图在内部绑定元素数据时，将再次触发该事件。

要避免这种情况，请参阅：http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-dataBound

你可以使用类似的东西：

var grid = $("#grid").data("kendoGrid");
grid.bind("dataBinding", grid_dataBinding);
grid.dataSource.fetch();

当初始配置绑定设置为autoBind: false时

这样您就不会意外地捕捉到第一个错误的dataBound事件。

如果我有时间，我会用一个演示这一点的JSFiddle回来。

解决方案1:这个小提琴应该有帮助。

解决方案2:

设置autoBind: false，使网格不自动绑定。(@jason9187 9187)

正如另一个用户所提到的，您可以通过更改上述telerik文档中提到的设置来关闭初始的自动绑定：

基本上，在您的第一种方法中，这个修复：

<div id="grid" data-bind="kendoGrid: { data: myData, dataBinding: dataBinding, dataBound: dataBound }"></div>

变成：

<div id="grid" data-bind="kendoGrid: { data: myData, dataBinding: dataBinding, dataBound: dataBound, autoBind: false }"></div>

或者将相同的属性添加到第二种方法中。

小提琴：http://jsfiddle.net/hXn7e/45/

Answer 2

设置autoBind: false，使网格不自动绑定。

this.gridConfig = {
    data: self.myData,
    autoBind : false,
    datasource: {
        data: 'data'
    },
    dataBound: function(){
        alert('dataBound');
    },
    dataBinding: function(){
        alert('dataBinding');
    },
};