DateChooser, decoupled objects make for an easy interface.

Built with prototype and a new style of event architecture allows for an all around easier grid API. Continued with an incredibly easy to use implementation of a date chooser.

Superclasses and Details

This demonstration is built using a small package of javascript classes that use the prototypejs library.

• GridBase an abstract javascript class that introduces a comprehensive grid event API. Ideal for subclasses to take advantage for click and drag or mouse over cell events.
• GridBuild further extends the GridBase class to introduce more methods for handling dynamic grid construction as well as easy data injection.
• GregorianCalendar a subclass of prototype's ObjectRange class. Defines a range of dates to represent a month.
• CalendarSelect extends GridBuild, using an instance of GregorianCalendar formats the data into a grid.
• DateSelect extends CalendarSelect, enhances the interface to include convienence controls.
• View Pure Demo Inspired by a comment on a previous post I have created a page that is an HTML document with only what is necessary for implementing the date chooser widget.

Addressing Comments

Some very helpful comments on this article which is pleasing to see. To address Jon and Alex's concerns I have developed a new subclass of CalendarSelect that uses two select boxes to engage the user, view the Demo.

To address Artemis's concerns I would suggest subclassing DateSelect and override the applyCellJSON function which is where you could implement special logic to assign more attributes to the cell for easier retrieval. Note that if you're looking to do something with a cell when it is clicked you can use the "cellclick" event, which is defined in GridBase .

Comments

Name
Site
Comment
	Reload Captcha Image
Captcha