Jquery is my all-around favorite Javascript library for developing websites with rich UIs (among many other assorted goodies offered by Jquery). In this post, I share my favorite date and time picker Jquery plugins.
Not strictly speaking a plugin, Datepicker comes out of the box as part of the Jquery UI add-on library, and is a tried and true rich UI date picking widget, with lots of config options. If you need something that “just works” quickly and gets the basic (date picking) job done fast, look no further than this one.
It looks like this:
As with all other Jquery UI widgets, it can be thoroughly styled to meet your look and feel needs.
Now a common use case in web forms with date fields is to also feature time entry fields. Although Datepicker does not come with time picking options out of the box, this isn’t a big issue as my next favorite plugin handles that quite neatly…
2. Timepicker Plugin for Jquery UI Datepicker
The Timepicker Plugin for Datepicker does pretty much what you would expect – it extends the basic Datepicker interface to include a nifty set of sliders to specify the time, like so:
The latest version of Timepicker is highly configurable and includes an option to use it as a standalone time-picking widget, without the date picking portion at all. However, some might not like the slider interface, and so enter another one of my favorites…
3. ClockPick
Clockpick uses an interesting cascading menu style interface which I find intuitive to use and easy to manipulate.
While I like Clockpick a lot and am currently using it on one project that I am working on, the look of the interface is admittedly not quite as stylin’ as Jquery Datepicker. So for a time picker widget with the cool looks of Datepicker but with the ease of use factor of the cascading menu style interface, we have…
This one has a REAL slick interface, and as an added bonus (which you can see from the screenshot below), it’s a snap to use any of the standard Jquery UI themes of your choice – making for a smooth integration on a form where you are already using Jquery Datepicker.
These are by no means the only date / time pickers out there for Jquery, but in my experience using and integrating these, I have found them to be among the best in class.