avoid multiple dataBound/dataBind on pushUpdate with array

[Vedad]

Hi, its me again with (gantt) dataSource and changes... and this is pretty urgent :(

I have a following situation, I need to change 5-10 resources/assignments on gantt task and I do it using pushUpdate method by sending an array of items to be updated. (dataSource.pushUpdate(arrayOfItemsForChange))

However this slows widget down because even if one pushUpdate is called, dataBound and dataBind events are triggered for each of them, and these events have some custom code as well (some proposed by support people here as well).
I did some measurements and for 7 items it takes approx 6 seconds to handle this on gantt, during which gantt "freezes" not allowing any action on the timeline.

Is there any way I can have widget (gantt) trigger dataBound and dataBind only once, at the and end then render everything it needs?

Thank you very much.

Best regards,

Vedad

[Veselin Tsvetanov]

Hello Vedad,

Instead of using the pushUpdate() on the Assignments DataSource, I would suggest you to directly modify the data present in the Assignments DS. To do that you could use the data() method of the DataSource in the following way:

var gantt = $("#gantt").getKendoGantt();
var assignementsDS = gantt.assignments.dataSource;
var assignements = JSON.parse(JSON.stringify(assignementsDS.data()));

var extendedDAssignements = assignements.concat([
  { taskId: 3, resourceId: 2, value: 0.5 },
  { taskId: 3, resourceId: 1, value: 0.5 }
]);

assignementsDS.data(extendedDAssignements);

The above should result in only one dataBinding and one dataBound call. This way the whole widget will be re-rendered only once.

Here is a small Dojo sample implementing the above suggestion:

https://dojo.telerik.com/iCEGOMoj/2

Regards,
Veselin Tsvetanov
Progress Telerik

[Vedad]

Hi Veselin, thank you for your answer, and sorry for me being slow in replying.

I have only one doubt, since your example is showing adding new elements.
I use pushUpdate to update existing items, not add new ones (occasionally this as well, but more common case is change of existing ones). In this case, is it safe to find item and remove it from data() and then add "updated replacement" as new array element, or there is some other approach.

Also, does the same approach works for gantt data source as well, or for it I should stick to the built in push methods?

Thank you and regards

[Veselin Tsvetanov]

Hello Vedad,

Concerning the assignments update, you should follow the same approach demonstrated in the dojo sent. In order to avoid the multiple dataBound and rendering you should change the full data in the Assignements DataSource with a single .data() call:

$('#btn').on('click', function() {
  var gantt = $("#gantt").getKendoGantt();
  var assignementsDS = gantt.assignments.dataSource;
  var assignements = JSON.parse(JSON.stringify(assignementsDS.data()));

  assignements[0].value = 0.5;
  assignements[1].value = 0.5;

  assignementsDS.data(assignements);
});

Here is a modified Dojo sample implementing the above scenario:

https://dojo.telerik.com/iCEGOMoj/3

As per the Gantt Task DataSource, if the multi-task pushUpdate() triggered multiple dataBound/render calls, you could use the same approach as for the assignments. Keep in mind that you should always entirely substitute the data in the DataSource using its data() method.

Regards,
Veselin Tsvetanov
Progress Telerik