In the month view, the Kendo-UI Calendar widget displays the days of the next or previous month to fill the remaining space in a week. When a date is selected, it is highlighted.
Imagine the following scenario:
This can easily be repoduced with the demo calendar.
Hi Michael,
I am writing you just to let you know that with the latest Kendo version - 2024.2.514 (2024 Q2) - the Calendar has been improved. With the latest version, the currently selected date will be highlighted if it is visible even when scrolling to the next or the previous month. You can test the current behavior in our demos - https://demos.telerik.com/kendo-ui/calendar/index.
With the above said, I am changing the status of the issue to 'Completed'.
We remain at your disposal in case you have any additional questions.
Regards,
Neli
Progress Telerik
Hi Michael,
Thank you for the additional details provided.
Currently, the selected date will be highlighted and the background will be changed only when the respective month is selected in the same month is displayed in the view. We are reviewing the UX of the Calendar and I have forwarded your report to the team. I will mark the thread with the 'Under review' tag until the UX team reviews the discussed scenario.
In the meantime, you can achieve the desired behavior by saving the selected date in a variable in the change event handler. Then, when the user navigates to a different view you can find the date and add to it a custom class. Next, you can use the custom class to style the date. Below is an example:
var selected = ''
$("#calendar").kendoCalendar({
change: function(e){
$('.custom').removeClass('custom')
selected = $('.k-selected .k-link').attr('data-value')
},
navigate: function(e){
if(selected != ''){
var current = $('[data-value="'+selected+'"]')
current.parent().addClass('custom')
}
}
});
});
The above is demonstrated in the Dojo linked here.
As a token of gratitude for reporting the issue I have updated your Telerik points.
Regards,
Neli
Progress Telerik
Hi!
The highlight you see is the current focused date. It always stays at the same day of the month. However, I would expect the currently selected to be marked.
Sorry for the confusion.
Hi Michael,
I tried to replicate the issue, but on my end, the selected date seems highlighted. I tried to select a date and then navigate to a different month than the current one. Please take a look at the screencast linked here and let me know if I am missing something - https://somup.com/cZnhiOph9q.
Looking forward to your reply
Regards,
Neli
Progress Telerik