How to Change the Default Starting Day of the Week

Environment

Product

DatePicker for Blazor, Calendar for Blazor

Description

This KB article answers the following questions:

• How can I change the first day of the week in the DatePicker?
• Is it possible to set a different day as the start of the week from the default one in the Telerik DatePicker for Blazor?
• What steps should I follow to modify the start of the week in a DatePicker component?

Solution

To set the start of the week to a different one in the Telerik DatePicker for Blazor, override the FirstDayOfWeek property of the current culture in your application. Follow the steps below to implement this solution:

1. Include the necessary namespaces for globalization in your component.
2. Add the Telerik DatePicker component to your razor page.
3. Override the OnInitialized method to change the current culture's FirstDayOfWeek to the desired one.

@using System.Globalization

<TelerikDatePicker @bind-Value="@Date"/>

@code {
    private DateTime Date { get; set; } = DateTime.Now;

    protected override void OnInitialized()
    {
        var cultureInfo = new CultureInfo("en-US");
        cultureInfo.DateTimeFormat.FirstDayOfWeek = DayOfWeek.Monday;
        CultureInfo.DefaultThreadCurrentCulture = cultureInfo;
        CultureInfo.DefaultThreadCurrentUICulture = cultureInfo;
    }
}

By setting the FirstDayOfWeek property to DayOfWeek.Monday, the DatePicker will start the week with Monday based on the modified culture settings.

See Also

• DatePicker Overview Documentation