Date and Time Limits
The DateTimePicker can display a date-and-time range between predefined min and max values, allowing the user to pick specific date and time only from that range.
To enable the user to select a date range, use the Kendo UI for Vue DateRangePicker component.
Limiting the Date Range
To define the start date, use the min property. To define the end date of the range, use the max property. When the DateTimePicker renders the ranges, it will take into account both date and time parts. The min value has to be lower than the max value.
If the
minvalue is10th of March, 12:30and10th of Marchis selected in thedatepart, thetimepart will prevent a selection before12:30. However, if11th of Marchis selected, thetimepart will allow any selection of time.
The following example demonstrates how to limit the value of the DateTimePicker to a certain date and time range.
Limiting the Time Range
To limit the selection of the time parts only, use the corresponding minTime and maxTime properties. This properties allow the developer to limit the time selection only, without taking care of the date part.
The following example demonstrates how to limit the time value of the DateTimePicker component, to simulated value selection in work hours only.