first_page

Design Diary: the Date and Date-Time Picker Problem

Don’t make the mistake made by this writer: the date and date-time picker problem is not trivial! Searching the Web for about an hour reveals that there are more date pickers than date and time pickers (see table below). What’s funny is that the search began at the YUI and ends there. The codeproject.com article “Using ASP.NET Calendar Control and Yahoo.UI.Calendar in ASP.NET,” by Michael Sync, the “Using Yahoo.UI.Calendar Control in ASP.NET Project” section, has the platform-independent code that appeals to my desired design.

The documentation for YAHOO.widget.Calendar is focused on the widget itself and not a popular use case like a pop up picker. The table below summarizes the other solutions to this problem during my misunderstanding about the Yahoo! Calendar not supporting pop ups:

The [corion.net date picker](http://corion.net/js/datepicker/). Barebones. Very attractive. But the Yahoo! SourceForge.net approach has a formalism that can’t be ignored (even for JavaScript).
“[Unobtrusive Date-Picker Widgit](http://www.frequency-decoder.com/2006/10/02/unobtrusive-date-picker-widgit-update)” Very clean. Very attractive. But the Yahoo! SourceForge.net approach has a formalism that can’t be ignored (even for JavaScript).
“[Fancy Time Picker](http://www.java2s.com/Code/JavaScript/GUI-Components/FancyTimePicker.htm)” Yes, this is a time picker—not a date picker. This could be used *with* a date picker. The word “fancy” does suggest old fashioned: the HTML “tags” are in uppercase.
[Tigra Calendar](http://www.softcomplex.com/products/tigra_calendar/) Uses a pop-up window. Not cool.
“[flash date time picker](http://www.flashtechworld.com/datetimepicker.html)” A misleading title for predominantly JavaScript-based list of pickers.

rasx()