As a follow-up to my article on js5hf – an unobtrusive javascript method for converting text type inputs to HTML5 input types, I wanted to put together a simple example of the new HTML5 inputs to demonstrate the formats in which they output data. So…you can see my example of HTML5 input element data formats which is semi-interactive – you can enter data as you wish and view the output by submitting the form.

A summary of the output formats is (any constant elements e.g. the “W” in week inputs and the “T” in datetime inputs are bolded):

  • Search: String
  • Number: String/Number
  • Range: String/Number
  • Tel: Unsupported at present
  • URL: String (Opera requires an absolute URL e.g. http://www.example.com)
  • Email address: String (The Email address format checks performed are minimal to day the least)
  • Date: YYYY-MM-DD
  • Month: YYYY-MM
  • Week: e.g. YYYY-WWW (e.g. 2010-04 is week 4 of 2010)
  • Time: HH:II:SS (e.g. 23:59:59)
  • Datetime: YYYY-MM-DDTHH:II:SS (e.g. 2010-04-25T23:59:59)
  • Datetime-local: YYYY-MM-DDTHH:II:SS (e.g. 2010-04-25T23:59:59)

You can see a more complete specification of HTML5 input elements on w3.org.