Knockout Kendo Сетка данныхBound events

Question

У меня есть сетка kendo ui, используя набор knockout-kendo.

У меня есть несколько пользовательских кнопок в одном столбце сетки, т. Е. Сделать вызов ajax для редактирования записи в другом div, удалить один или проверить, чтобы editId вызывал функцию. Моя проблема: , что оба события дважды запускались! Кроме того, для меня это выглядит как dataBound событие и dataBinding Событие такое же.

Херес fiddle

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

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

Я попробовал несколько различных подходов.

Heres еще fiddle

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

События увольняют когда сетка связана, и когда данные связаны. Но как я могу убедиться, чтобы получить только событие, когда все данные есть?

Кто-нибудь знает, что там происходит? BTW Я использую плагин отображения.

Answer 1

Событие dataBound стреляет по разным причинам. В первый раз это срабатывает, если вы console.log() события, вы увидите, что:

• e.sender._data является пустым массивом []
• e.element[0] является div.k-grid.k-widget

Когда срабатывает событие во второй раз, те же свойства, что и:

• e.sender._data - массив длиной три, c ontaining предметы, как: { color: "green", name: "apple", uid: "..." }
• e.element[0] является div.k-grid.k-widget (тот же элемент)

Который, кажется, подразумевает, что ваша сетка в-самом деле данные по связыванию к себе в два раза.

Если бы я должен был догадаться, KO ko.applyBindings(new ViewModel()); инициализирует объект и запускает событие. После этого событие запускается снова, когда кендо пытается связать данные элементов внутри.

Чтобы избежать этого, см: 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

Так что вы не случайно поймать это первый false данныеBound мероприятие.

Если у меня есть время, я вернусь с помощью JSFiddle, который продемонстрирует это.

Решение 1: Это Fiddle должно помочь.

Решение 2:

Установите autoBind: false так, что сетка не выполняет автоматического связывания. (@ Jason9187)

В качестве другого упоминался, вы можете превратить пользователь первоначальный автоматически связываются с помощью изменения настроек, описанные в вышеуказанной документации 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>

Или добавив то же свойство к вашему второму подходу.

Fiddle: 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'); 
    }, 
};