Replace content of Kendo ObservableArray without event
I have a KendoUI grid with data in an ObservableArray.
var aKendoObservableArray = new kendo.data.ObservableArray([ .....]);
// defining the grid ....
dataSource: {
data: aKendoObservableArray,
pageSize: 10,
schema: {
model: {
id: "_jobInstanceId" // the identifier of the model
}
}
},
I want to replace the contents of this array now that I have received new data from the server. I tried splicing the array to clear it and add new content one at a time. This leads to a huge performance hit as kendo tries to figure out with each addition how to break the mesh. Is there a way to replace the contents of the Kendo UI ObservableArray when firing the change event only once?
+3
source to share
2 answers
The KendoUI forum has an answer to this question. We need to clear the array (one of the events to be removed) and push all elements at once (one event is fired)
http://www.telerik.com/forums/passing-array-to-observablearray-push
Thus, I will need
// clean the array
aKendoObservableArray.splice(0, aKendoObservableArray.length);
aKendoObservableArray.push.apply(aKendoObservableArray, [{...},{...},{...},{...},{...}];
+2
source to share
Ultimately, this is what I had to do to remove the element:
var idToRemove = $(this).parent().attr('data-id');
// remove all items that do not share the ID the user is trying to delete
for (var i = 0; i < e.model.MyArrayOfItems.length; i++) {
if (e.model.MyArrayOfItems[i].idToMatch == idToRemove)
e.model.MyArrayOfItems.splice(i, 1);
}
0
source to share