behavior: calendar

calendar is date input element allowing to select particular date.

Elements

that have this behavior applied by default:

• <input type="calendar" /> - inline date input element.

Model

The calendar has four different view modes:

• decades view - table of 10-year decades;
• decade view - table of 10 years in decade;
• months view - table of 12 months in a year;
• days view - table of days in a month.

Each mode uses <table> to render content of the view. Use DOM inspector to discover DOM structure of each view if you will need to style content of the calendar in some specific manner.

Attributes

that this behavior knows about:

• value="YYYY-MM-DD" - initial date, string in ISO 8601 format.
• firstdayofweek="N" - first day of week, N is a number: 0 - Sunday, 1 - Monday, etc.

Events

Aside of standard set of events (mouse, keyboard, focus) behavior: calendar generates:

• SELECT_STATE_CHANGED event - view has changed, e.g. month changed. Posted (asynchronous) event.
• SELECT_SELECTION_CHANGED event - date changed. Posted (asynchronous) event.

Value

Date value or undefined, reflects current selection.

Methods

N/A - this input element has no specific methods.