Alternatives to jQuery timepicker

I confirm. This time picker really isn't intuitive. I's a bug, i tested this picker with ~10 users and they never used it correctly.

For now I suggest to simply disable JS for the time when the pop-up calendar are enabled.

The problem with the current time picker:
- no feedback if the user enters a "false" value
- you need to use "tab" to edit two values of the same field.
- you don't to need write the ":" (but the user thinks he needs to, so he writes it...)

Solution:
- never block key!
- user needs to write the ":" separator, don't jump it. (if you create two fields the user needs to press "tab" and tab to pass from the first field to the second. A lot of users don't know the "tab" key and use the mouse but all users know the ":")
- JS complete time like this: 9:30 to 09:30
- JS highlight the edited number and when a key is pressed go to the next.

A patch to disable JS for time but keep the calendar pop-up for date.

The patch worked as expected, but I'm in general agreement with the OP that the timepicker should be formatted as hour, minute, and am/pm select lists so that the user need only use a mouse to select each component of the date/time.

http://haineault.com/media/examples/jquery-utils/demo/ui-timepickr.html

This timepicker looks *really* good .. the spinner button time picker, which much more intuitive than the current implementation is still somewhat difficult to use. That being said the one Im linking to is probably not that useful if you need minute granularity as opposed to 15, 10 or 5 minute granularity.

Edit-- The timepicker I linked to above is much more robust now:

http://haineault.com/media/jquery/ui-timepickr/page/

That's a very nice timepicker Ryan - better than the one I initially suggested.

How can I put this on my site? Does anyone know of a way? The current timepicker is so hard to use.

subscribe

I installed this patch and it appeared to install without issue, but the timepicker is still displaying. Do I need to change the widget type or some such setting to see a change?

Thanks.

Ok, I discovered that the patch didn't actually take, modified the code manually, and now see that the timepicker has been disabled.

While I see that this is doing exactly as it was intended to do, I'm disappointed in the result. I was hoping that disabling the js time picker would cause a revert to the time select functionality with drop down menus. While I think a js time picker like some linked to in this thread are kinda cool, what I would really like to see is a separation between the date and time interfaces where I could use js for the date selection and the old standby drop down lists for the time selection. Or at the very least, I think this would be a useful option for those who might not want/need a fancy schmancy js time picker.

Just my .02

I needed a good timepicker ASAP, so based on input here, below is what it took to make this work. Sorry to the beginners if this doesn't make sense... Note, this doesn't work in IE and I couldn't figure out why...

//put this in your or somebody else's module (paths are based on latest tarball, as of today)

//in javascript somewhere
var periods = ["AM","PM"];
$('.jquery-timeentry-1').timepickr({
format12: "{h:02.d}:{m:02.d}{suffix:s}",
convention: 12,
prefix: periods,
suffix: periods
});
});

I committed a change today that will allow you to turn off the jQuery timepicker and still use the jQuery calendar. It's a site-wide default. It will revert to a plain text box for the picker, not a drop-down selector.

It would take more work to get the drop-down selector working. If someone wants to make a patch to do that, you are welcome to provide it, but I don't have time to do it.

I've spent a productive evening integrating Mr. Haineault's timepickr jquery widget into date_popup in date-6.x-2.2.tar.gz (thanks to light-blue for a starting place).

Instructions for use:

Download jquery.timepickr-0.6.6-standalone.zip from http://code.google.com/p/jquery-utils/downloads/list

unpack jquery.timepickr-0.6.6-standalone.zip and you will find a new directory called 'standalone' with a subdirectory called ui-timepickr. Move ui-timepickr into modules/date/date_popup.

Then apply the attached patch, by copying to modules, then:

patch -p0 < date_popup_timepickr.patch

Any forms that you've specified date_popup to be used will now use timepickr.

Known issues:

timepickr only pops up in firefox 3 (haven't tested 3.5) and does not seem to popup in safari 4 (haven't tested 3). (note, the standalone version/demo of timepickr seems to work without a hitch on safari 3 and 4, so, this is probably related to the next issue)

It requires 2 focus click events on the time input before it starts to function, i.e. click or tab into the time field, and timepickr doesn't show up. Click outside of the time field (to take away focus from it), then click in the time field again, and now it shows up. I've no idea why yet.

The theme of the date picker becomes _very_ different and I'm not sure why yet, probably some namespace collisions within the various .css and .js files from jquery-utils?

Any advice would be appreciated to help me over these (probably) newbie issues.

KarenS - time is a valuable commodity and I, and I'm sure many others, appreciate all that you have given to the Date module.

I almost certainly don't possess the skills necessary to get a drop down timepicker option working, but when I get a chance I'm going to look into it some more and see if I can come up with anything. If I do I will, of course, post what I find here.

Interestingly, I also stumbled upon another jquery timepicker plugin which might also work for my needs - http://www.protocoder.com/javascript/jquery-simple-clock-plugin-for-time...

I'll be taking a look at this as well, but thought I'd post it here in case someone much smarter than I knows how to integrate it into the Date module, maybe as another timepicker option in KarenS' Timepicker selection menu.