My 3rd and final attempt writing a datePicker (calendar) that is accessible using the keyboard, requires no embedded JavaScript blocks, uses no pop-up windows and is suitable for use within documents served as application/xhtml+xml.
asked for features into the mix
To all & sundry: I’ve finally managed to devote some time to a complete rewrite of the datePicker/calendar script – again. Full details on the latest version can be found on the Unobtrusive Date-Picker Widget V5 article page.
The LowDown

My 3rd and final attempt writing a datePicker (calendar) that is accessible using the keyboard, requires no embedded JavaScript blocks, uses no pop-up windows and is suitable for use within documents served as application/xhtml+xml.

The more impatient amongst you may want to see the various demos before reading any further.
At a glance…

* Fully keyboard accessible
* Multiple date formats and date dividers supported
* Unobtrusive and nameSpace friendly
* Fully skinnable with CSS
* Both upper and lower date limits can be set
* Certain days of the week can be disabled
* Certain dates can be disabled/enabled (and wildcards used to stipulate the dates in question)
* Includes “smart” localisation
* Bespoke days of the week can be highlighted
* Works with single text inputs, split text inputs or select lists
* It’s free to use, even commercially (Released under a CC share-alike license)

New features include…

* Numerous accessibility enhancements including support for ARIA Roles and States
* All keyboard shortcuts now adhere to The DHTML Style Guide Working Group (DSGWG) recommendations
* DOM friendly – the calendar is only added to the DOM when actually required
* DatePickers can now display an optional status bar and week numbers
* DatePickers can now be dragged around the screen (activated by clicking on either the datePicker’s header or footer)
* Lower and upper date limits can now be set using either a YYYYMMDD date String or a relative “days”, “weeks”, “months” or “years” notation
* The script can parse and format dates using a subset of the PHP strftime conversion specifiers
* Global configuration parameters can now be specified using JSON within the script tag itself
* The “button” used for popup datePickers can now be styled for default, hover, active and disabled states, be arbitrarily positioned within the DOM and removed from the document tabindex if so desired
* Inline datePickers are now available (i.e. no button activation is required), are automatically added to the document’s tabIndex and can be arbirarily positioned within the DOM
* A bespoke final opacity can be defined for pop-up datePickers and the fade in/out animation effect disabled
* The entire grid can now be filled with dates
* Bespoke “append id’s” can now be set for datePickers split over 3 form elements
* The “Today” button can be removed from the U.I.
* Three bespoke events, “dateselect”, “redraw”, and “create” are now available.

Demo: http://www.frequency-decoder.com/demo/date-picker-v4/
Download: http://www.frequency-decoder.com/demo/date-picker-v4/date-picker-v4.zip
Source: http://www.frequency-decoder.com/2009/02/03/unobtrusive-date-picker-widget-v4

Related Listings:

1. jQuery Date Picker Script This is an clean, unobtrusive plugin for jQuery which allows...
2. DatePicker and Calender Eightysix Calendar Eightysix is an unobtrusive developer friendly calendar and datepicker,...
3. Unobtrusive Table Sort Script Updated The “Unobtrusive Table Sort Script”, that addresses speed issues present...

Do you like this post?

Email: