Skip to content

jQuery Date/Time picker

by Jonathon on March 27th, 2009

This experimental plugin for the jQuery UI datepicker widget looks promising:

date-time

You can get it via SVN.

Update: The Filament Group has also made a really cool datepicker.

From → Notebook

20 Comments
  1. cease permalink

    I checked out source from repository and was not able to see anything. Is there anywhere else I can look to get more information on this widget. Looks awesome by the way

  2. cpicker permalink

    Hi Jonathon, is this date time picker finished?

  3. gondo permalink

    its useless !
    first of all it doesnt respect jquery plugin codex
    second it totally overwrite original datapicker
    third you can’t even use original options, it ll just ignore them
    forth css + js code is rly lame

    i thought it ll be easier and quicker just to try to fix it, but its total waste of time, rather ll write my own

  4. Jonathon permalink

    If you’ll send me a link when you finish your version, I would be delighted to link to it.

    This was venturing into new territory for me, I don’t fully understand the methods of writing or extending jquery plugins. If you have any advice or tutorials you can point me to that would be very helpful.

    Thanks!

  5. Jahn permalink

    Hey, is it finished?

  6. Jonathon permalink

    No, but anyone is welcome to pick it up and finish it and I will be happy to link to it here.

  7. I found this is one of the best time pickers yet, but I could only find a working copy of the code here:

    http://blog.w3visions.com/2009/04/date-time-picker-with-jquery-ui-datepicker/

    Here’s the download link for a perfectly working copy (please note this “gondo”) :

    http://blog.w3visions.com/wp-content/selfloaded/datetimepicker.zip

  8. I found a bug whereby if the date field is empty, nothing is inserted into the field. I made a minor change to the plugin that seems to fix this bug. I am also using it with jquery 1.4.2 and UI version 1.7.2

    The plugin currently does not work with jquery UI version 1.8. I am trying to figure this one out.

    Here’s a working demo with a download link (everything included):

    http://www.opcmf.com/datetimepicker/

  9. I see a lot of time pickers use the slider approach, but sliders are a bit tedious for selecting specific times. I suggest you check out the Any+Time™ Datepicker/Timepicker AJAX Calendar Widget. It’s perhaps the fastest-and-easiest-to-use time picker available, because it uses simple buttons to select specific times with speed and ease. Deets/download here:

    http://www.ama3.com/anytime/

    An interesting test of usability is this: pick an odd time (say, 10:32pm), then see how long it takes to accurately select that time using various time pickers. You can probably do it faster with Any+Time™ than you could write out the time by hand–just try to find another picker you can say that about! Not to mention, Any+Time™ supports a countless variety of date/time formats, 12/24-hour clock, full CSS (or jQuery UI) customization and even time zones!

  10. Nice work Andrew! That is without a doubt the best date/timepicker I have seen ever.

    It would have been great to have used your plugin on my last project if only I could have found it.

    I will be recommending your plugin to my users in the future and will add a link to your timepicker in my own timepicker page.

  11. Daniel permalink

    A simple JQuery DateTimePicker with UI Styles that is easy to implement is http://www.projectcodegen.com/JQueryDateTimePicker.aspx

  12. roy permalink

    this is the best date time picker yet
    http://jonathonhill.net/2009-03-27/jquery-datetime-picker/

    It also works gr8 with the new 1.8.2 JQuery ui and the new JQuery 1.4.2.

  13. Graeme Hyde permalink

    I disagree with Peter I think while the Any+Time™ Datepicker/Timepicker AJAX Calendar Widget is good it is way too intrusive in size and far more complicated in usability than what I’m looking for. I have searched high and low for the best time picker and here is what I found and suggest as the best: Timepicker Addon.Simple, compact, effective, easy to use, uses the jQuery UI themes, can be used as just a time picker or as a date and time picker, works with jQuery UI 1.8.2 and jQuery 1.4.2 – fantastic!! Thank you Trent Richardson.

  14. Thanks for posting this. Its where I picked up the initial idea. Check out http://jquery.developmental.co.za/datetime It looks like UI date picker and sliders but its totally custom dev, is themeroller ready and uses the UI widget framework. Hope it helps someone out =]

  15. Paul permalink

    I personally like this one. Is UI theme ready and has great features.

    http://manfersite.co.cc/dateplustimepicker/demo/demo.html

  16. Avilla permalink

    My complaint is all these huge scripts needing jQuery etc. I just want a simple datetime picker. The few I’ve seen aren’t that bad, but they’re usually missing just that one or two features, like toggle enable/disable selecting past or future dates, and supplying a date instead of auto-defaulting to current date. I don’t really care about styles, I can just tweak the hardcoded css until it looks like how I want it, I don’t need bloated theme handling crap.

    There doesn’t seem to be a middle ground. Either people are writing simple mindless datetime pickers which barely handle any parameters, or full-out huge bloated crazy pickers with features I wouldn’t use.

  17. Jonathon permalink

    If you’re feeling ambitious, write one :) I’ll be happy to link to it.

  18. Thanks for the link Paul. Nice code there.

Leave a Reply

Note: XHTML is allowed. Your email address will never be published.

Subscribe to this comment feed via RSS