DxCalendar<T>.EnableMultiSelect Property

Specifies whether multiple dates can be selected in the calendar.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v20.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public bool EnableMultiSelect { get; set; }

Property Value

Type	Description
Boolean	true if multiple date selection is enabled; otherwise, false.

Remarks

Set the EnableMultiSelect property to true to enable multiple date selection in the calendar. The SelectedDates collection stores the selected dates.

<DxCalendar EnableMultiSelect="true" 
            SelectedDates="@GetSelectedDates()" />

@code {
    List<DateTime> GetSelectedDates() {
        DateTime baseDate = DateTime.Today;

        return new List<DateTime>() { baseDate.AddDays(-9), baseDate.AddDays(-5), baseDate.AddDays(-4), 
                                      baseDate.AddDays(6), baseDate.AddDays(12), baseDate.AddDays(13), 
                                      baseDate.AddDays(15) };
    }
}

To select a range of dates, a user should select the initial date, hold the left mouse button, and move the mouse to the final date. To add/remove individual dates to/from the selection, a user should click a date with the Ctrl key pressed.

Run Demo: Calendar - Multi Select

Watch Video