jQuery date time 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   Is there a good jQuery plugin for selecting dates and times in a single UI control with a usable interface

User · Answer

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

User · Answer

This is some code I use to have a user select one datetimepicker  set the datetime  and have the other datetimepicker add One Minute to that time   I needed this for a custom medication control      Anyway  thought it might help someone else since I could not find the answer any where online       at least not a complete answer   Keep in mind that the 60000 added  adds one minute   60   1000 milliseconds       frdtPicker   datetimepicker           onClose  function dateText  inst                var endDateTextBox       todtPicker                if  endDateTextBox val                            var testStartDate   new Date dateText                   var testEndDate   new Date endDateTextBox val                     if  testStartDate  gt  testEndDate                         var testStartDate   new Date dateText  getTime     60000                      var testStartDate2   new Date testStartDate                         endDateTextBox datetimepicker  setDate    new Date testStartDate2                                                 else                   var testStartDate   new Date dateText  getTime     60000                  var testStartDate2   new Date testStartDate                   endDateTextBox datetimepicker  setDate    new Date testStartDate2                                   frdtPicker   val dateText     endDateTextBox val                         onSelect  function selectedDateTime                var start     this  datetimepicker  getDate                    todtPicker   datetimepicker  option    minDate   new Date start getTime

User · Answer

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

User · Answer

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

User · Answer

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

User · Answer

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 datetimepicker htm  Here is the demo page link    http   www rainforestnet com datetimepicker datetimepicker-demo htm  good luck

User · Answer

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

User · Answer

Not jQuery  but it works well for a calendar with time  JavaScript Date Time Picker   I just bound the click event to pop it up       arrival-date   click function         NewCssCal   this  attr  id     mmddyyyy    dropdown   true  12

User · Answer

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

User · Answer

In my view  dates and times should be handled as two separate input boxes for it to be most usable and efficient for the user to input  Let the user input one thing at a time is a good principle  imho   I use the core UI DatePicker  and the following time picker   This one is inspired by the one Google Calendar uses   jQuery timePicker  examples  http   labs perifer se timedatepicker  project on github  https   github com perifer timePicker  I found it to be the best among all of the alternatives  User can input fast  it looks clean  is simple  and allows user to input specific times down to the minute    PS  In my view  sliders  used by some alternative time pickers  take too many clicks and require mouse precision from the user  which makes input slower

User · Answer

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

User · Answer

Take a look at the following JavaScript plugin   Javascript Calendar with date and time  I ve made it to be simple as possible  but it still in its early days  Let me know the feedback so I could improve it

[javascript] jQuery date/time picker

Examples related to javascript

Examples related to jquery

Examples related to datepicker

Examples related to datetimepicker