Search code examples
asynchronouskendo-uitypescriptangularkendo-scheduler

Kendo UI Scheduler - setting slotTemplate after data received from server

In the 'navigation' event of the scheduler I am getting data from a server for the new date. I have a function that is called from slotTemplate of the day view that uses the data received to color the scheduler slots.

I use Angular2, TypeScript and Reactive-Extensions/RxJS Observable to receive the answer from the server.

My problem is that when I navigate to another date, the slotTemplate function is being run before the answer from the server is processed so the data isn't available for coloring the slots. Sure enough, after the data is ready, the slotTemplate function isn't being run again.

I would much prefer to use Kendo's built-in methods, if possible, and less jQuery, to solve this issue.

Any ideas how I can do this?

Solution

  • Solved: Resetting the view to it's current value redraws the scheduler.

    When the Observable returns you can color the scheduler's slots or do any other change to the DOM and then re-set the view and the changes will be shown.

    The code to re-set the view is:

    let scheduler = $("#scheduler").data("kendoScheduler");
scheduler.view(scheduler.viewName());