[Solved] How do you get the calendar to show the selected date month instead of current date?

[Matt Smith]

I am migrating my .net framework app to Blazor and am trying to mimic the behavior of the AJAX calendar where the calendar shows the month of the selected date.

For example, the date that the calendar is being set to is May 10, 2026. However, when the calendar is initially displayed, it is showing October and a focus date of the current day.

Given the users will be using this to define appointments or meetings in the future (or review the item from the past is I am doing), it is very confusing that the selected date month view is not shown. It took me a while to clue in that the date was correct it was just the calendar not showing the month I was expecting.

Also in the second image you can see that the 21 is still focused even though the view is May and that is not correct.

[Ivan Danchev]

Hello Matt,

You can show the selected date by using two-way binding for Date and Value:

@using Telerik.Blazor.Components

<TelerikCalendar @bind-Date="@StartDate"
                 @bind-Value="@SelectedDate"
                 SelectionMode="@CalendarSelectionMode.Single"></TelerikCalendar>
<p>Selected Date: @SelectedDate</p>

@code {
    private DateTime SelectedDate { get; set; } = new DateTime(2026, 5, 10, 0, 0, 0);
    private DateTime StartDate { get; set; } = new DateTime(2026, 5, 9, 0, 0, 0);
}

Example: https://blazorrepl.telerik.com/wKvOQRFd18Fhzf7x49 

In this case Value is set to 10 May, and Date is set to 9 May. 

Regards,
Ivan Danchev
Progress Telerik