Kendo UI for jQuery DateTimePicker Overview

Loading Demo...
  • EXAMPLE
  • VIEW SOURCE
index.html

Also available for:

API REFERENCE
kendo ui kendoka logo

The DateTimePicker component is part of Kendo UI for jQuery, a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

Description

The Kendo UI for jQuery DateTimePicker control enables you to select a date and time value from a calendar, a time drop-down list, or through direct input.

The current example displays how users can effortlessly edit and select dates in the control.

This DateTimePicker example is part of a unique collection of hundreds of jQuery demos, with which you can see all Kendo UI for jQuery components and their features in action. View the source code of the demos from the library or directly adapt, and edit them and their theme appearance in Kendo UI for jQuery Dojo or ThemeBuilder.

Functionality and Features

  • Disabled dates—The DateTimePicker allows you to disable specific days which are not intended to be selected by the end user such as weekends and national holidays.
  • Pre-selected date and time—You can also render a pre-selected date and time and define the minimum and maximum date and time slots it displays.
  • Start view and depth—The DateTimePicker enables you to set the initial view it renders and define the navigation depth of the views.
  • Start and End time for the TimeView—The DateTimePicker enables you to set the start and end time of the TimeView.
  • Calendar types—You can use any of the calendar types with which the DateTimePicker can work.
  • Component type—The DateTimePicker allows you to choose between its classic and modern component types.
  • Validation—The DateTimePicker allows you to enable its validation by using the Kendo UI for jQuery Validator.
  • Formatting—You can also define the date and time formatting of the DateTimePicker component.

Support & Learning Resources

Additional Resources