jCalendar
a jQuery calendar by ted serbinski

about

jCalendar is an inline dynamic calendar built with jQuery. It originally started off based on the great jQuery date picker by Kelvin Luck but has quickly morphed into its own code base.

jCalendar v0.5 can be used with 3 form selects (one for day, month, and year) to visually select a specific date for input.

Coming soon will be v1.0, which will allow for not only visually selecting dates but also for displaying them in both mini and full page calendar views, similar to that of Google Calendar.

demo

features

• Defaults to today's date if no selected values are supplied
• Automatically sets the boundaries of the calendar (e.g., prev/next) based on first and last years specified in the select year form element
• Accessible, select dates and browse calendar using the TAB button
• Navigation for previous and next calendar months, along with automatically jumping back to today's date
• Fully themable through CSS
• Degrades to normal form selects if JavaScript is off
• Works with jQuery 1.0.4 or 1.1.2

todo

• Add in configurable classes at runtime
• Add in configurable weekday, link, and month names
• Add in ability to pass in an array of dates & values to plot on the calendar
  • Mini mode to plot calendar with bullets to indicate events on that day, click to popup and show
  • Large or full page mode to list events (up to X amount), and then click to see more
• Optimize and clean up code (still a few remnants of date picker that can be refactored)

use

1. Download jQuery, either version 1.0.4 or 1.1.2
2. Download jCalendar — source or compressed or svn checkout
3. Download optional jCalander CSS
4. Add 3 form selects for day, month, and year with classes jcalendar-select-day, jcalendar-select-month, jcalendar-select-year
5. Wrap the 3 selects in <div class="jcalendar-selects">
6. Attach jcalendar. Example:

   $(document).ready(function() {
     $('fieldset.jcalendar').jcalendar();
   });

7. Enjoy better usability :-)

changelog

• Complete SVN changelog
• 15 Apr 2007 - v0.5 released

contact

Please use the contact form on my blog to send comments, suggestions, and general feedback. Thanks!