05-Using-HTML5-Form-Elements-and-Attributes.pdf

HTML5 Forms HTML Forms HTML forms are used to collect user input. The element The element defines an HTML form: form elements here HTML forms contain form elements in different types like input elements, checkboxes, radio buttons, submit buttons, and more… The Element...

HTML5 Forms HTML Forms HTML forms are used to collect user input. The element The element defines an HTML form: form elements here HTML forms contain form elements in different types like input elements, checkboxes, radio buttons, submit buttons, and more… The Element The element is the most important form element. The element has many variations, depending on the type attribute  Text Input and Submit Button defines a one-line input field for text input: defines a button for submitting a form to a form-handler. The form-handler is typically a server page with a script for processing input data. The form-handler is specified in the form's action attribute: The method attribute specifies the HTTP method (GET or POST) to be used when submitting the forms. Chrome Firefox Safari Internet Explorer The Element The Element Message: Type your message here… The Element The element defines a clickable button Click Me! HTML5 Element The element specifies a list of pre-defined options for an element. The list attribute of the element, must refer to the id attribute of the element. The datalist tag is not supported in Safari or IE9 (and earlier). HTML Input Types Input Type: text defines a one-line input field for text input: First name: Last name: Input Type: password defines a password field: User name: User password: Input Type: checkbox and Radio defines a radio button. Radio buttons let a user select ONLY ONE of a limited number of choices: Male Female defines a checkbox. Checkboxes let a user select ZERO or MORE options of a limited number of choices. I have a bike I have a car HTML5 Input Types HTML5 added several new input types: color date datetime datetime-local email month number range search tel time url week List of some common input restrictions (some are new in HTML5) Input Type: color The is used for input fields that should contain a color. Depending on browser support, a color picker can show up in the input field. Select your favorite color: Input Type: number The is used for input fields that should contain a numeric value. You can set restrictions on the numbers. Depending on browser support, the restrictions can apply to the input field. Quantity (between 1 and 5):