Calendrical is a jQuery plugin to provide Date and Time pickers for HTML forms. It was developed in response to a need for a more user friendly way to specify date and time ranges in a web application I’m currently working on.
Click to view a live demo of Calendrical
I’m putting this out as open source software under the MIT license, as a simpler and more user friendly option to the existing range of jQuery date picker plugins. If you find this plugin useful or have any comments, please let me know!
Thanks for creating this really nice plugin. It is exactly what I need, but I am experiencing a problem. When I try to use this control in IE8, the selected date and time does not appear in the input box. It works correctly in FireFox. Thanks.
- Ben
Hi Tobias,
This plugin is extremely usable and I’ve successfully used it in a form I’m working on. I am encountering the same issue as described by Ben above, where the selected values are not writing back as set values in the form input fields. I’ve noticed that the demo at: http://tobiascohen.com/demos/calendrical/ has this same issue when viewing via IE8.
Have you by chance looked into this or otherwise have thoughts as to a solution? I’m fully down to spoof another browser type via http-equiv tags, etc.!!!
Thanks!
-Wayne
Hi there. great plugin.
Is there any way to change time to 24 hour format?
Figured out a little workaround for the IE8 issue. The reason this is happening is because IE8 will blur the currently focussed object on mousedown.
I only did this for the time item, but the same fix should work for the date too.
add the following after var monthNames line:
var clicking = false;
add this at the end of the click function in the renderTimeSelect function:
clicking = false;
add this before the e.preventDefault() line in the mousedown function in the calendricalTime function:
clicking = true;
change the blur function in calendricalTime to read
if (!clicking){
if (!div) return;
div.remove();
div = null;
}
and it seems to work in IE8, Firefox and Chrome.