Forms in html5

Forms in html5

• 1.
  What are Forms What are forms? - HTML Forms are required when you want to collect some data from the site visitor. For example registration information: name, email address, credit card, etc. Form elements are like text fields, textarea fields, drop-down menus, radio buttons, checkboxes, etc. which are used to take information from the user.
• 2.
  Most frequently usedform attributes  name: This is the name of the form.  action: Here you will specify any script URL which will receive uploaded data.  method: Here you will specify method to be used to upload data. It can take various values but most frequently used are GET and POST.  target: It specifies the target page where the result of the script will be displayed. It takes values like _blank, _self, _parent etc.
• 4.
  Examples - http://www.eightonefive.com/code/form5/index.php - http://www.deque.com/padam/demo-accessible-client- side-form-validation-with-html5.html -http://www.wufoo.com/html5/example/
• 5.
  HTML Forms • Newinput types • New rendering • New input features  EX: Placeholder Text, AutoFocus
• 6.
  Input example . <input type="_________"/> <input type="_________"/>  checkbox  radio  submit  reset  image  button text password hidden file email Tel url search color number range datetime*
• 9.
  [No unique keyboardfor Date/Time] Chrome for Android improves the story, but only available to fraction of Android users.
• 10.
  Enter your email: <inputtype="email" placeholder="Enter your email" required title="Please enter your email" /> <input type="submit" value="Submit" />
• 11.
  New Attributes • Morecontrol over input behavior  Still no JavaScript  Improved usability • Attributes:  Placeholder  Autofocus  Max Length  List  AutoComplete  Required  Pattern  Spellcheck – NoValidate – FormNoValidate – Accept – Multiple – Min/Max – Step
• 12.
  Patern - html5pattern.com •Change message  In Chrome, use input title attribute (Not FF, O, S) • Pattern attribute
• 13.
  HTML 5 FORMSCSS STYLES  http://www.sitepoint.com/html5-forms-css/
• 14.
  Resourses http://diveintohtml5.info/forms.html http://www.w3.org/TR/html5/forms.html http://www.w3schools.com/html/html_form_attributes.asp html5pattern.com - Paternsin Html 5 http://www.wufoo.com/html5 - Browser support input types http://www.wufoo.com/html5/example/ http://webdesign.tutsplus.com/tutorials/bring-your-forms-up-to-date-with-css3-and-html5- validation--webdesign-4738 http://www.html5rocks.com/en/tutorials/forms/html5forms/ http://webdesign.tutsplus.com/tutorials/bring-your-forms-up-to-date-with-css3-and-html5- validation--webdesign-4738 http://html5doctor.com/css3-pseudo-classes-and-html5-forms/