YouTip

* * * ## HTML5 New Form Attributes HTML5 has added several new attributes to the `

` and `` tags. New `` attributes: * `autocomplete` * `novalidate` New `` attributes: * `autocomplete` * `autofocus` * `form` * `formaction` * `formenctype` * `formmethod` * `formnovalidate` * `formtarget` * `height` and `width` * `list` * `min` and `max` * `multiple` * `pattern (regexp)` * `placeholder` * `required` * `step` * * * ## The `` / `` `autocomplete` Attribute The `autocomplete` attribute specifies whether a form or input field should have an auto-complete feature. When a user starts typing in an auto-complete field, the browser should display suggested options for that field. **Tip:** The `autocomplete` attribute can be enabled on the `` element while being disabled on an individual `` element. **Note:** The `autocomplete` attribute applies to the `` tag, as well as the following types of `` tags: `text`, `search`, `url`, `telephone`, `email`, `password`, date pickers, `range`, and `color`. : ```html First name:
Last name:
E-mail:

``` [Try it Yourself »]( **Tip:** In some browsers, you may need to enable the auto-complete feature for this attribute to take effect. * * * ## The `

` `novalidate` Attribute The `novalidate` attribute is a boolean attribute (true or false). It is a boolean property of the HTML form element that instructs the browser not to perform validation on the form. When this attribute is added to the `` element, the browser will not execute default form validation and will not check whether input fields meet specified validation rules. Using the `novalidate` attribute allows developers full control over form validation logic, enabling them to customize validation behavior through JavaScript or other methods. ![Image 6: Opera]( 7: Safari]( 8: Chrome]( 9: Firefox]( 10: Internet Explorer]( ## Example A form whose data is submitted without validation: ```html E-mail:

``` [Try it Yourself »]( * * * ## The `` `autofocus` Attribute The `autofocus` attribute is a boolean attribute. It specifies that the input field should automatically receive focus when the page loads. ![Image 11: Opera]( 12: Safari]( 13: Chrome]( 14: Firefox]( 15: Internet Explorer]( ## Example Make the "First name" input field automatically focused when the page loads: ```html First name: ``` [Try it Yourself »]( * * * ## The `` `form` Attribute The `form` attribute specifies one or more forms to which the input field belongs. **Tip:** To reference multiple forms, use a space-separated list. ![Image 16: Opera]( 17: Safari]( 18: Chrome]( 19: Firefox]( 20: Internet Explorer]( ## Example An input field located outside the form still belongs to the HTML form: ```html

First name:

Last name: ``` [Try it Yourself »]( * * * ## The `` `formaction` Attribute The `formaction` attribute specifies the URL address where the form will be submitted. It overrides the `action` attribute of the `

` element. **Note:** The `formaction` attribute applies only to `type="submit"` and `type="image"` inputs. ![Image 21: Opera]( 22: Safari]( 23: Chrome]( 24: Firefox]( 25: Internet Explorer]( ## Example This HTML form contains two submit buttons with different submission URLs: ```html First name:
Last name:

``` [Try it Yourself »]( * * * ## The `` `formenctype` Attribute The `formenctype` attribute describes the encoding method used when submitting form data to the server (only applicable when the form's `method` is set to `"post"`). It overrides the `enctype` attribute of the `

` element. **Important:** This attribute is used with `type="submit"` and `type="image"` inputs.  ## Example The first submit button sends form data using the default encoding, while the second submit button uses the `"multipart/form-data"` encoding: ```html First name:

``` [Try it Yourself »]( * * * ## The `` `formmethod` Attribute The `formmethod` attribute defines how the form will be submitted. It overrides the `method` attribute of the `

` element. **Note:** This attribute can be used with `type="submit"` and `type="image"` inputs. ![Image 32: Safari](https:// www./images/compa...