Show DevExpress
DateBox calendar as a year selection
By setting
DevExteme(). DateBox(). CalendarOptions you can set the selection control as a
calendar object with selection of year
|
.CalendarOptions(
options=>options.ZoomLevel(CalendarZoomLevel.Year)
.MaxZoomLevel(CalendarZoomLevel.Decade)
.MinZoomLevel(CalendarZoomLevel.Decade)
)
|
|
<div class="dx-field">
<div class="dx-field-label">Date List</div>
<div class="dx-field-value">
@(Html.DevExtreme().DateBox()
.DisplayFormat("MMM yyyy")
.Value(DateTime.Now)
.CalendarOptions(
options=>options.ZoomLevel(CalendarZoomLevel.Year)
.MaxZoomLevel(CalendarZoomLevel.Decade)
.MinZoomLevel(CalendarZoomLevel.Decade)
)
)
</div>
</div>
|
When switching to
CalenderarZoomLevel.Decade, the selection above the years is always switched
per 10 years
CalendarZoomLevel.Century
CalendarZoomLevel.Month
Display as a
month selection of a year
|
<div class="dx-field">
<div class="dx-field-label">Date List</div>
<div class="dx-field-value">
@(Html.DevExtreme().DateBox()
.DisplayFormat("MMM yyyy")
.Value(DateTime.Now)
.CalendarOptions(
options=>options.ZoomLevel(CalendarZoomLevel.Year)
)
)
</div>
</div>
|
