DxDateEdit<T>.CalendarViewMode Property

Specifies available calendar views and selectable date units.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

[Parameter]
public CalendarViewMode CalendarViewMode { get; set; }

Property Value

An enumeration value.

|

Available values:

This component displays all views ( Month , Year , Decade ). Users can select days, months, and years.

| | Year |

This component hides the Month view. Users can select months and years in Year and Decade views.

| | Decade |

This component hides Month and Year views. Users can select years in the Decade view.

|

Remarks

You can use the ViewMode property to hide certain calendar views and implement the following scenarios:

• Disable day selection. Users can select years and months.
• Disable day and month selection. Users can only select years.

The following example initially displays the Year view and disables day selection:

<DxDateEdit Date="DateTime.Now" 
            CalendarViewMode="CalendarViewMode.Year"
            Mask="@DateTimeMask.MonthAndYear" />

When day selection or day/month selection is disabled, the Date Edit component selects the first day of a chosen month or year. You can update your business object value as your needs dictate. In the following code snippet, the component passes the 15th day of a month to a business object:

<DxDateEdit @bind-Date="@SelectedDate" 
            CalendarViewMode="CalendarViewMode.Year"
            Mask="DateTimeMask.MonthAndYear" />

Selected Date: <b>@date.ToString("MMMM yyyy")</b>

@code {
    DateTime date; // Business object
    DateTime SelectedDate {
        get
        {
            return new DateTime(date.Year, date.Month, 1);
        }
        set
        {
            date = new DateTime(value.Year, value.Month, 15);
        }
    }
}

See Also

DxDateEdit<T> Class

DxDateEdit<T> Members

DevExpress.Blazor Namespace