Description

This script generates a calendar widget when the user focuses on an input element whose type attribute is set to 'date'. The widget disappears when the user either selects a value from the widget or when the control loses focus. The underlying input element's value is set to the chosen date in ISO8601 format (YYYY-MM-DD).

The widget only partially implements the form validation model. It only fires the 'invalid' and 'input' events in DOM Level 2 Events supporting browsers (i.e. not IE6/7); however, it will execute a function assigned to the control's 'oninvalid' or 'oninput' javascript property or any code in the respective element attributes. The keyword 'this' will not be available in that context, though an event object from which it can be retrieved (through the srcElement property) will be passed as an argument. It does not implement the form event model.

Usage

Simply place the script in the head section of your document.

<script type='text/javascript' src='input-type-date.js'></script>