10 Best Date And Time Picker JavaScript Plugins (2020 Update)

by jQueryScript,

What is Date/Time Picker

A Date/Time picker is a UI component that makes it easier to help visitors to quickly select dates, times and/or date ranges on the booking, schedule, event calendar web apps.

The Best Date/Time Picker

In this post you will find the 10 best Date/Time Picker plugins implemented in jQuery and Pure (Vanilla) JavaScript. I hope you like it.

Originally Published Dec 04 2017, updated Feb 10 2020

Table of contents:

jQuery Date/Time Picker Plugins:

Lightweight jQuery Date Input Picker - pickadate

pickadate is a mobile-friendly, lightweight, and responsive jQuery plugin that helps you attaches a customizable Date Picker to your input field.

Lightweight jQuery Date Input Picker - pickadate

[Demo] [Download]


Clean jQuery Date and Time Picker Plugin - datetimepicker

datetimepicker is a jQuery plugin that popups a simple and clean date & time picker interface when an input field on focus.

Clean jQuery Date and Time Picker Plugin - datetimepicker

[Demo] [Download]


Beautiful Animated jQuery Date Picker Plugin - datedropper

datedropper is a pretty simple jQuery plugin which appends a beautiful, customizable and animated date picker to your input fields.

Beautiful Animated jQuery Date Picker Plugin - datedropper

[Demo] [Download]


Simple Clean Date Picker Plugin with jQuery - Air Datepicker

Just another jQuery date picker plugin which makes it easier to select dates, months, and/or date range from a pretty clean, fully customizable calendar interface.

Simple Clean Date Picker Plugin with jQuery - Air Datepicker

[Demo] [Download]


Multi-language jQuery Date Range Picker Plugin

A fully customizable, cross-browser and multi-language jQuery date picker plugin which enable the users to select custom (or predefined) date ranges with ease.

Multi-language jQuery Date Range Picker Plugin

[Demo] [Download]


Vanilla JS Date/Time Plugins:

Flat Style JavaScript Date Picker – flatpickr

flatpickr is a super simple JavaScript library which enables the visitor to pick a date from a flat, clean, customizable calendar.

Flat Style JavaScript Date Picker – flatpickr

[Demo] [Download]


Highly Customizable Date and Time Picker with Rome.js

Rome.js is a simple to use JS library for appending a highly customizable date & time picker on your input field when clicked/focused on.

Highly Customizable Date and Time Picker with Rome.js

[Demo] [Download]


salsa-calendar

salsa-calendar is a simple, standalone JavaScript library created to generate date (range) pickers for hotel booking applications.

salsa-calendar

[Demo] [Download]


Hello Week

A beautiful, Material Design styled datetime picker component which allows you select date and time from a modal popup. Based on Materialize CSS framework.

Hello Week

[Demo] [Download]


lightPick

lightPick.js is a JavaScript library to lets you create a flexible, customizable, multi-language, user-friendly date range picker component using moment.js.

lightPick

[Demo] [Download]


Conclusion:

Want more jQuery plugins or JavaScript libraries to create awesome date/time pickers on the web & mobile? Check out the jQuery Date Picker and JavaScript Date Picker sections.

More Resources: