pickadate.js

The mobile-friendly, responsive, and lightweight
jQuery date & time input picker.

Download pickadate.js v3.5.0

Demo§

// The date picker (read the docs)
$('.datepicker').pickadate()
// The time picker (read the docs)
$('.timepicker').pickatime()

There’s a tonne of options to customize the date and time pickers, such as month/year selectors, time intervals, etc.

There’s also a rich API to extend the functionality of the picker. Some examples are displayed on Codepen.

When using the “classic” theme, it is important to have a wrapper div with position: relative around the source input to ensure the picker is sized according go the input element it is bound to.

Features§

  • Supports jQuery 1.7 and up.
  • Is ARIA-enabled to be WCAG 2.0 compliant. (added in v3.4)
  • Leaves a tiny footprint of 6kb JS and 2kb CSS. (minified and gzipped)
  • Comes with translations for 38 languages.
  • Has touch & keyboard friendliness.
  • Follows BEM style class naming.
  • Utilizes LESS based stylesheets.
  • Includes a Grunt based build system.

Browser Support§

Supports all modern browsers – and IE8+.

Specifically, v3 has been tested with Chrome MWA, Firefox MWA, Opera MWA, Safari Mi, Internet Explorer W, Blackberry 6.0+ and Android 3.2+ browsers.

M = Mac, W = Windows, A = Android, i = iOS

Make sure to also include the legacy.js file along for the oldie browsers.

Community§

pickadate.js is an open source project, shared under an MIT license. All code and discussions are hosted on Github.

Contributions are very welcome – please read these pointers before submitting a bug report or feature request.

If you find this library useful and would like to see further development, consider supporting it.