DateRangePicker
Kendo UI DateRangePicker component
Definition
Namespace:Kendo.Mvc.UI
Assembly:Kendo.Mvc.dll
Syntax:
public class DateRangePicker : WidgetBase, IWidget, IHtmlAttributesContainer, IScriptableComponentInheritance: objectWidgetBaseDateRangePicker
Implements:
Inherited Members
Constructors
Initializes a new instance of the DateRangePicker class.
public DateRangePicker(ViewContext viewContext, IJavaScriptInitializer initializer, IUrlGenerator urlGenerator)The view context
initializerIJavaScriptInitializerThe JavaScriptInitializer
urlGeneratorIUrlGeneratorThe URL generator.
Properties
Specifies the adaptive rendering of the component.
public AdaptiveMode? AdaptiveMode { get; set; }Allows customization of the subtitle's text in the adaptive view of the component.
public string AdaptiveSubtitle { get; set; }Allows customization of the title's text in the adaptive view of the component.
public string AdaptiveTitle { get; set; }Enables the user to select an end date that is before the start date.
public bool? AllowReverse { get; set; }Specifies a template used to populate value of the aria-label attribute of the currently focused cell of the calendar..The parameters available for the template are: current - The current focused date.; valueType - The focused item value type - month, year and etc. or text - A text representing the focused value..
public string ARIATemplate { get; set; }The handler for the ARIATemplate
public string ARIATemplateHandler { get; set; }The id for the ARIATemplate
public string ARIATemplateId { get; set; }If this property is enabled and you have configured min and/or max values, and the user enters a value that falls out of that range, the value will automatically be set to either the minimum or maximum allowed value.
public bool? AutoAdjust { get; set; }Specifies whether the calendar popup should close automatically when a range is selected.
public bool? AutoClose { get; set; }If this configuration is enabled, a calendar button will appear inside the date inputs. This is similar to the calendar button in the DatePicker component. The calendar popup will be opened only when the button is clicked. Clicking inside the input itself will have no effect.
public bool? CalendarButton { get; set; }If this configuration is enabled, a clear button will appear in the date inputs where a date is selected. Clicking on the clear button will remove the selected date from the input.
public bool? ClearButton { get; set; }Specifies the culture info used by the component. A valid kendo culture file must be added to the page in order for the example to work. <script src="https://kendo.cdn.telerik.com/{kendo version}/js/cultures/kendo.culture.de-DE.min.js"></script>
public string Culture { get; set; }Specifies a list of dates, which will be passed to the month template.
public DateTime[] Dates { get; set; }Specifies the navigation depth. The following settings are available for the depth value: "month" - Shows the days of the month. (default value); "year" - Shows the months of the year.; "decade" - Shows the years of the decade. or "century" - Shows the decades from the century..
public string Depth { get; set; }public IEnumerable<string> DisableDates { get; set; }public ClientHandlerDescriptor DisableDatesHandler { get; set; }Specifies the end field name for model binding.
public string EndField { get; set; }Sets a value controlling how the color is applied.
public FillMode? FillMode { get; set; }The template which renders the footer of the calendar. If false, the footer will not be rendered.
public string Footer { get; set; }Specifies the format, which is used to format the value of the DateRangePicker displayed in the input. The format also will be used to parse the input.For more information on date and time formats please refer to Date Formatting.
public string Format { get; set; }Specifies the inputmode attribute of the inner <input /> element. It is used to specify the type of on-screen keyboard that should be displayed when the user focuses the input.
public string InputMode { get; set; }Determines if the labels for the inputs will be visible.
public bool? Labels { get; set; }Specifies the maximum date, which the calendar can show.
public DateTime? Max { get; set; }Allows localization of the strings that are used in the widget.
public DateRangePickerMessagesSettings Messages { get; set; }Specifies the minimum date that the calendar can show.
public DateTime? Min { get; set; }Templates for the cells rendered in the calendar "month" view.
public MonthTemplate Month { get; set; }Configures the Kendo UI DateRangePicker range settings.
public DateRangePickerRangeSettings Range { get; set; }Sets the size of the component.
public ComponentSize? Size { get; set; }Specifies the start view. The following settings are available for the start value: "month" - Shows the days of the month.; "year" - Shows the months of the year.; "decade" - Shows the years of the decade. or "century" - Shows the decades from the century..
public string Start { get; set; }Specifies the start field name for model binding.
public string StartField { get; set; }If set to true a week of the year will be shown on the left side of the calendar. It is possible to define a template in order to customize what will be displayed.
public bool? WeekNumber { get; set; }Methods
public override IDictionary<string, object> Serialize()Overrides:
Writes the HTML.
protected override void WriteHtml(HtmlTextWriter writer)The HtmlTextWriter.
Overrides:
Writes the initialization script.
public override void WriteInitializationScript(TextWriter writer)The TextWriter.
Overrides: