Home > HTML5, Web > HTML5 Forms

HTML5 Forms

HTML5 has many improvements for forms! Now you don’ t have to use javascript for a lot of the functions… as soon as all browsers support it.

Input Types

  • button
  • checkbox
  • color
  • date
  • datetime
  • datetime-local
  • email
  • file
  • hidden
  • image
  • month
  • number
  • password
  • radio
  • range : a range of numbers
  • reset
  • search
  • submit
  • tel
  • text
  • time
  • url
  • week

Auto Focus

<input type=”text” name=”name” id=”name” tabindex=”10″ autofocus>

Placeholder Text

<input type=”text” name=”name” id=”name” tabindex=”10″ placeholder=”place holder text here”>

Form Validations (Required Fields)

<input type=”text” name=”name” id=”name” tabindex=”10″ required>

Numbers

<input type=“numbers” name=”howmany” id=”howmany” tabindex=”10″ min=”1″ max=”10″ value=”1″>

  • Step = increments value
  • max = maximum number
  • min = minimum number
  • value = default number value

Date Pickers

<input type=“date” name=”name” id=”name” tabindex=”10″ min=”1″ max=”10″ value=”1″>

  • input type=”date” : gives you a calendar
  • input type=”month” calendar with month pull down menu
  • input type=”week” calendar with week pull down menu
  • input type=”datetime”  calendar with a time picker
  • input type=”datetime-local”  date time with no time-zone offsetl
  • input type=”time” no calendar, just a time picker
Advertisements
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: