Template:Caltech Calendar
From 2012.igem.org
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
JAVASCRIPT EXAMPLES Calendar
In this example, an instance of the Uize.Widget.Calendar
class is used to wire up a simple calendar widget. The HTML markup for the calendar widget is provided by the Uize.Templates.Calendar
JavaScript template. Initially, the calendar's value is set to today's date. However, you can change it's value by clicking on a different date of this month, or you can use the arrows to navigate to and select a date from a different month.
The month and year that the calendar displays are accessible through the month
and year
set-get properties, respectively. Below the calendar widget is a summary of its current state and some links to let you programmatically interact with the calendar. Play around with the calendar widget and see how the state updates, and mess with the links to control the calendar.
- Current State
- calendar.get ('value') == new Date ('')
- calendar.get ('month') ==
- calendar.get ('year') ==
- Navigate Programmatically
- MONTH
- PREVIOUS MONTH: calendar.set ({month:calendar.get ('month') - 1})
- NEXT MONTH: calendar.set ({month:calendar.get ('month') + 1})
- YEAR
- PREVIOUS YEAR: calendar.set ({year:calendar.get ('year') - 1})
- NEXT YEAR: calendar.set ({year:calendar.get ('year') + 1})
- MONTH