Date Range

Dec 17, 2020

Two DateEdit extensions can be combined to implement a date range picker functionality. In this case, one editor is used to specify the start date, and another date editor specifies the end date. To link editors, set the DateRangeAttribute.StartDateEditFieldName property of the end-date editor to the field name of the start-date editor.

csharp

public class DataRangePickerModel {
        [Display(Name = "Start Date")]
        public DateTime Start { get; set; }

        [Display(Name = "End Date")]
        [DateRange(StartDateEditFieldName = "Start", MinDayCount = 1, MaxDayCount = 30)]
        public DateTime End { get; set; }
}

You can customize the date range setting using the properties exposed by the DateRangeAttribute class. For instance, you can limit the date range using the following properties.

DateRangeAttribute.MinDayCount - specifies the minimum number of days in a range.
DateRangeAttribute.MaxDayCount - specifies the maximum number of days in a range.

You can get the number of days selected within a range by using the client-side ASPxClientDateEdit.GetRangeDayCount method.

Important

The date range settings should be specified for the end-date editor.