kendo-ui

kendo datepicker change event doesn't refresh the month view

I have a kendo date picker defined as follows: 

<input id="datePicker" data-format="dd.MM.yyyy" data-month='{ "content": "&lt;span class=\"#= dateRange.hasReport(data.date) ? \"boldDate\" : \"normalDate\" #\"&gt;#=data.value #&lt;/span&gt;" }' data-role="datepicker" data-bind="value: new Date(), events: {change: dateChanged}" style="width:150px;" />

In the month template, I bold some dates depending on whether there is a report or not for that date by a call to the method dateRange.hasReport(data.date)

Now, there is an external event which causes the daterange to change. I want to now refresh the calender view so that the dateRange.hasReport is called for all dates again.

I am unable to find a way to do this.

Any ideas?

Solution

  • I fixed it by destroying the element and recreating it again

    $("#datePicker").data("kendoDatePicker").destroy();
$('#datePicker').empty();
createDatePicker(); //Creates the datepicker widget again
$("#datePicker").closest("span.k-datepicker").width(150);