jQuery DateTime Picker

Question

I've been looking around for a decent jQuery plugin that can handle both dates and times. The core UI DatePicker is great, but unfortunately I need to be able to take time in as well.

I've found a few hacks for the DatePicker to work with times, but they all seem pretty inelegant and google isn't turning up anything nice.

Do any of you know of a good jQuery plugin for selecting dates and times in a single UI control with a usable interface?

Thanks!

Answer 1

I've had some good luck with this one:

http://code.google.com/p/dyndatetime/

Demos are here:

http://www.mechanicalmarksy.com/hosted/toolman/dyndatetime/example.html

Answer 2

I have ran into that same problem. I actually developed my using server side programming, but I did a quick search to try and help you out and found this.

Seems alright, didn't look at the source too much, but seems to be purely JavaScript.

Take look:

http://www.rainforestnet.com/datetimepicker.htm

Here is the demo page link:

http://www.rainforestnet.com/demo_datetimepicker.htm

good luck

Answer 3

My best experience with a datepicker is with the prototype-based AnyTime. I know that's not jQuery, but it may still be worth the compromise for you. I know absolutely no prototype, and it's still easy enough to work with.

One caveat I've found: it is not forward compatible on some browsers. That is, it did not work with a newer version of prototype on Chrome.

Answer 4

Timepicker looks promising, especially since it builds on top of jQuery UI. Try the demo.

Here's another Timepicker (same name, maybe same codebase roots). Very similar approach.

jQuery.timepickr is a clever approach and looks like it supports the jQuery UI themes.

Answer 5

I researched this just recently and have yet to find a decent date picker that also includes a decent time picker. What I ended up using was eyecon's awesome DatePicker, with two simple dropdowns for time. I was tempted to use Timepickr.js though, looks like a really nice approach.

Answer 6

@David, thanks for the recommendation! @fluid_chelsea, I've just released Any+Time(TM) version 3.x which uses jQuery instead of Prototype and has a much-improved interface, so I hope it now meets your needs:

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

Any problems, please let me know via the comment link on my website!

Answer 7

How about this one:

http://razum.si/jQuery-calendar/TimeCalendar.html

Answer 8

Just to add to the info here, The Fluid Project has a nice wiki write-up overviewing a large number of date and/or time pickers here.

Answer 9

This one has potential, including ui styles.

http://www.projectcodegen.com/JQueryDateTimePicker.aspx

Answer 10

We had trouble finding one that worked the way we wanted it to so I wrote one. I maintain the source and fix bugs as they arise plus provide free support.

http://www.yart.com.au/Resources/Programming/ASP-NET-JQuery-Date-Time-Control.aspx

Answer 11

By far the nicest and simplest DateTime picker option is http://trentrichardson.com/examples/timepicker/.

It is an extension of the jQuery UI Datepicker so it will support the same themes as well it works very much the same way, similar syntax, etc. This should be packaged with the jQuery UI imo.

Answer 12

i make one function like this :

function getTime()
{
    var date_obj = new Date();
    var date_obj_hours = date_obj.getHours();
    var date_obj_mins = date_obj.getMinutes();
    var date_obj_second = date_obj.getSeconds();

    var date_obj_time = "'"+date_obj_hours+":"+date_obj_mins+":"+date_obj_second+"'";
    return date_obj_time;
}

then i use the jquery ui datepicker like this :

$("#selector").datepicker( "option", "dateFormat", "yy-mm-dd "+getTime()+"" );

so, i get the value like this : 2010-10-31 12:41:57