DateTimePickerBuilder
Methods
ARIATemplate(System.String)
Specifies a template used to populate aria-label attribute.
Parameters
template - System.String
The string template.
Example
@( Html.Kendo().DateTimePicker()
.Name("dateTimePicker")
.ARIATemplate("Date: #=kendo.toString(data.current, 'd')#")
)
Interval(System.Int32)
Sets the interval between hours.
Parameters
interval - System.Int32
The interval between hours.
Example
@( Html.Kendo().DateTimePicker()
.Name("dateTimePicker")
.Interval(2)
)
Interval(System.Action)
Specifies the interval between values in the popup list. When the componentType is set to modern, the interval is specified as an object of hours, minutes and seconds.
Parameters
action - System.Action<IntervalSettingsBuilder>
The interval settings.
Example
@(Html.Kendo().DateTimePicker()
.Name("dateTimePicker")
.ComponentType("modern")
.Interval(interval => interval
.Hour(3);
.Minute(20);
.Second(15);
)
)
BindTo(System.Collections.Generic.IList)
Binds the TimeView to a list of DateTime objects.
Parameters
dates - System.Collections.Generic.IList<DateTime>
The dates.
Example
@( Html.Kendo().DateTimePicker()
.Name("TimePicker")
.BindTo(new List<DateTime>{ DateTime.Now })
)
Footer(System.Boolean)
Enables/disables footer of the calendar popup.
Parameters
footer - System.Boolean
The value that displays or hides the footer of the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.Footer(false)
)
Footer(System.String)
Footer template to be used for rendering the footer of the Calendar.
Parameters
footer - System.String
The value that configures the content of the footer for the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.Footer("#= kendo.toString(data, "G") #")
)
FooterId(System.String)
FooterId to be used for rendering the footer of the Calendar.
Parameters
id - System.String
The id value that will be used for rendering the footer of the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.FooterId("widgetFooterId")
)
Depth(Kendo.Mvc.UI.CalendarView)
Specifies the navigation depth.
Parameters
depth - CalendarView
The value that will specify the navigation depth.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.Depth(CalendarView.Month)
)
Start(Kendo.Mvc.UI.CalendarView)
Specifies the start view.
Parameters
start - CalendarView
The value that will specify the start view.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.Start(CalendarView.Month)
)
WeekNumber(System.Boolean)
If set to true, a week numbers will be shown on the Calendar.
Parameters
weekNumber - System.Boolean
The value that display or hide the week number of the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.Start(CalendarView.Month)
)
MonthTemplateId(System.String)
MonthTemplateId to be used for rendering the cells of the Calendar.
Parameters
id - System.String
The id value that will be used for rendering cells the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.MonthTemplateId("widgetMonthTemplateId")
)
MonthTemplateView(System.Web.Mvc.MvcHtmlString)
MonthTemplateView to be used for rendering the cells of the Calendar.
Parameters
template - System.Web.Mvc.MvcHtmlString
The Razor View that will be used for rendering cells the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.MonthTemplateView(Html.Partial("MonthTemplateView"))
)
MonthTemplateHandler(System.String)
MonthTemplateHandler to be used for rendering the cells of the Calendar.
Parameters
template - System.String
The JavaScript that will be used for rendering cells the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.MonthTemplateHandler("handler")
)
MonthTemplate(System.String)
Templates for the cells rendered in the "month" view.
Parameters
content - System.String
The content that will be used for rendering cells the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.MonthTemplate("#= data.value #")
)
MonthTemplate(Kendo.Mvc.UI.Fluent.TemplateBuilder)
Templates for the cells rendered in the "month" view.
Parameters
template - TemplateBuilder<TModel>
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.MonthTemplate(Html.Kendo().Template()
.AddHtml("<div>${data.value} </div>")
)
)
MonthTemplate(System.Action)
Configures the content of cells of the Calendar.
Parameters
monthTemplateAction - System.Action<MonthTemplateBuilder>
The action method that will be used for rendering cells the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.MonthTemplate(month => month.Content("#= data.value #"))
)
Min(System.String)
Sets the minimal date, which can be selected in DatePicker.
Parameters
date - System.String
The date value that will set the minimal value for selection.
Example
@( Html.Kendo().DateTimePicker()
.Name("dateTimePicker")
.Min(DateTime.Today)
)
Max(System.String)
Sets the maximal date, which can be selected in DatePicker.
Parameters
date - System.String
The date value that will set the maximum value for selection.
Example
@( Html.Kendo().DateTimePicker()
.Name("dateTimePicker")
.Max(DateTime.Today)
)
TimeFormat(System.String)
Specifies the format, which is used to format the values in the time drop-down list.
Parameters
timeFormat - System.String
The value that will be used to format the predefined values in the time list.
Example
@( Html.Kendo().DateTimePicker()
.Name("dateTimePicker")
.TimeFormat("hh:mm:ss tt")
)
DisableDates(System.Collections.Generic.IEnumerable)
Parameters
disableDates - System.Collections.Generic.IEnumerable<String>
DisableDates(System.DayOfWeek[])
Specifies the disabled dates in the DateTimePicker widget.
Parameters
days - System.DayOfWeek[]
The days that will be disabled in the Calendar.
Example
@(Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.DisableDates(DayofWeek.Saturday, DayOfWeek.Sunday)
)
DisableDates(System.String)
Specifies the disabled dates in the DateTimePicker widget using a function.
Parameters
handler - System.String
The JavaScript funcation that will be used to define the disabled cells in the Calendar.
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.DisableDates("disableDates")
)
ComponentType(System.String)
Specifies the component type of the widget. "classic" - Uses the standard rendering of the widget. or "modern" - Uses new rendering with a fresh and modern look and feel..
Parameters
value - System.String
The value for ComponentType
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.ComponentType("classic")
)
Size(Kendo.Mvc.UI.ComponentSize)
Sets the size of the component.
Parameters
value - ComponentSize
The value for Size
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.Size(ComponentSize.Medium)
)
Rounded(Kendo.Mvc.UI.Rounded)
Sets a value controlling the border radius.
Parameters
value - Rounded
The value for Rounded
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.Rounded(Rounded.Medium)
)
FillMode(Kendo.Mvc.UI.FillMode)
Sets a value controlling how the color is applied.
Parameters
value - FillMode
The value for FillMode
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.FillMode(FillMode.Outline)
)
StartTime(System.String)
If set, specifies the earliset time the TimeView can show.
Parameters
date - System.String
The value for StartTime
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.StartTime(new DateTime(2023,3,3,8,30,00).ToString())
)
StartTime(System.DateTime)
If set, specifies the earliset time the TimeView can show.
Parameters
date - System.DateTime
The value for StartTime
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.StartTime(new DateTime(2023,3,3,8,30,00))
)
EndTime(System.String)
If set, specifies the latest time the TimeView can show.
Parameters
date - System.String
The value for StartTime
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.EndTime(new DateTime(2023,3,3,8,30,00).ToString())
)
EndTime(System.DateTime)
If set, specifies the latest time the TimeView can show.
Parameters
date - System.DateTime
The value for StartTime
Example
@( Html.Kendo().DateTimePicker()
.Name("DateTimePicker")
.EndTime(new DateTime(2023,3,3,8,30,00))
)
InputMode(System.String)
Defines the "inputmode" attribute of the inner <input /> element. The attribute specifies the type of on-screen keyboard displayed when the user focuses the input.
Parameters
value - System.String
The value that configures the "inputmode" attribute.
Example
@(Html.Kendo().DateTimePicker()
.Name("dtp")
.InputMode("numeric")
)
Animation(System.Boolean)
Use to enable or disable animation of the popup element.
Parameters
enable - System.Boolean
The boolean value.
Example
@( Html.Kendo().DatePicker()
.Name("DatePicker")
.Animation(false) //toggle effect
)
Animation(System.Action)
Configures the animation effects of the widget.
Parameters
animationAction - System.Action<PopupAnimationBuilder>
The action which configures the animation effects.
Example
@( Html.Kendo().DatePicker()
.Name("DatePicker")
.Animation(animation =>
{
animation.Open(open =>
{
open.SlideIn(SlideDirection.Down);
})
})
)
AutoAdjust(System.Boolean)
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.
Parameters
value - System.Boolean
The value that configures the autoadjust.
Example
@(Html.Kendo().DatePicker()
.Name("DatePicker")
.AutoAdjust(true)
)
Culture(System.String)
Specifies the culture info used by the widget.
Parameters
culture - System.String
Example
@( Html.Kendo().DatePicker()
.Name("DatePicker")
.Culture("de-DE")
)
Events(System.Action)
Configures the client-side events.
Parameters
clientEventsAction - System.Action<DatePickerEventBuilderBase>
The client events action.
Example
@( Html.Kendo().DatePicker()
.Name("DatePicker")
.Events(events =>
events.Open("open").Change("change")
)
)
Format(System.String)
Sets the date format, which will be used to parse and format the machine date. Defaults to CultureInfo.DateTimeFormat.ShortDatePattern.
Parameters
format - System.String
ParseFormats(System.Collections.Generic.IEnumerable)
Specifies the formats, which are used to parse the value set with value() method or by direct input.
Parameters
formats - System.Collections.Generic.IEnumerable<String>
Enable(System.Boolean)
Enables or disables the picker.
Parameters
value - System.Boolean
Min(System.DateTime)
Sets the minimal date, which can be selected in picker.
Parameters
date - System.DateTime
Max(System.DateTime)
Sets the maximal date, which can be selected in picker.
Parameters
date - System.DateTime
Value(System.Nullable)
Sets the value of the picker input
Parameters
date - System.Nullable<DateTime>
Value(System.String)
Sets the value of the picker input
Parameters
date - System.String
DateInput(System.Boolean)
Specifies if the picker will use DateInput for editing value
Parameters
value - System.Boolean
The value for DateInput
DateInput()
Specifies if the picker will use DateInput for editing value
Popup(System.Action)
Configures the popup settings of the widget.
Parameters
popupAction - System.Action<PopupSettingsBuilder>
Messages(System.Action)
Allows localization of the strings that are used in the widget.
Parameters
configurator - System.Action<DatePickerBaseMessagesSettingsBuilder>
The configurator for the messages setting.
Label(System.Action)
Adds a label before the input. If the input has no id attribute, a generated id will be assigned. The string and the function parameters are setting the inner HTML of the label.
Parameters
configurator - System.Action<LabelSettingsBuilder>
AdaptiveMode(Kendo.Mvc.UI.AdaptiveMode)
Parameters
value - AdaptiveMode
AutoCorrectParts(System.Boolean)
Sets a value that indicates whether to automatically correct the segment when out of range. In order to work, dateInput prop should be set to true.
Parameters
value - System.Boolean
The value for AutoCorrectParts
ToComponent()
Returns the internal view component.
Name(System.String)
Sets the name of the component.
Parameters
componentName - System.String
The name of the component.
Example
@(Html.Kendo().Grid<OrderViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.OrderID).Filterable(false);
columns.Bound(p => p.Freight);
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Read(read => read.Action("Orders_Read", "Grid"))
)
)
Deferred(System.Boolean)
Suppress initialization script rendering. Note that this options should be used in conjunction with
Parameters
deferred - System.Boolean
ModelMetadata(System.Web.Mvc.ModelMetadata)
Uses the Metadata of the Model.
Parameters
modelMetadata - System.Web.Mvc.ModelMetadata
The metadata set for the Model
HtmlAttributes(System.Object)
Sets the HTML attributes.
Parameters
attributes - System.Object
The HTML attributes.
HtmlAttributes(System.Collections.Generic.IDictionary)
Parameters
attributes - System.Collections.Generic.IDictionary<String,Object>
AsModule(System.Boolean)
Specifies whether the initialization script of the component will be rendered as a JavaScript module.
Parameters
value - System.Boolean
Render()
Renders the component.
Example
@(@Page Inherits="System.Web.Mvc.ViewPage<IEnumerable<Product>>" )
@( Html.Kendo().Grid(Model)
.Name("grid")
.DetailTemplate(product => {
)
Product Details:
<div>Product Name: @( product.ProductName )</div>
<div>Units In Stock: @( product.UnitsInStock )</div>
@(
})
.Render();
)
ScriptAttributes(System.Object,System.Boolean)
Sets the JavaScript attributes to the initialization script.
Parameters
attributes - System.Object
The JavaScript attributes.
overrideAttributes - System.Boolean
Argument which determines whether attributes should be overriden.
ScriptAttributes(System.Collections.Generic.IDictionary,System.Boolean)
Sets the JavaScript attributes to the initialization script.
Parameters
attributes - System.Collections.Generic.IDictionary<String,Object>
The JavaScript attributes.
overrideAttributes - System.Boolean
Argument which determines whether attributes should be overriden.