Form tag in HTML5

In this article I am going to describe about the implementation and use of Form Tag in HTML5.
  • 1915

Form Tag

The HTML <form> tag is used for declaring a form. Form is like a container that contains text, button, checkbox, radio button etc.

It support different controls. These controls is input controls, which is use for input user data. A HTML form always starts <form> tag. It is most important for each and every website, because it is use for registration , order, searching etc. Purpose of the form tag is that it specifies one or more forms to which the input element belongs.

Note: By using the form attribute, the input elements can be placed anywhere on the page, not just within the form element. Also, a single input element can be associated with more than one form.

Syntax

Syntax of form tag in HTML5

<form attributes>controls</form>

Browser Support

<form> tag is supported in all major browsers.

Attributes of <form> tag

The form tag is available in both HTML5 and HTML4.01. But there is some attribute in HTML5, that is not supported by HTML4.01.

HTML5 has added two new attributes: autocomplete and novalidate, and removed the accept attribute.

There are following attributes:

    Attribute                         Value                                            Description
  accept-charset character-set Specifies the character encodings that are to be used for the form submission
  action URL Specifies where to send the form-data when a form is submitted
  autocomplete on

off

Specifies whether a form should have autocomplete on or off
  enctype application/x-www-form-urlencoded
multipart/form-data
text/plain
Specifies how the form-data should be encoded when submitting it to the server (only for method="post")
  method get

post

dialog

Specifies the HTTP method to use when sending form is submitted.
  name text Specifies the name of a form
  novalidate novalidate Specifies that the form should not be validated during submitted
  target _blank

_self

_parent

_top

Specifies where to display the response that is received after submitting the form

Example of <form> tag in HTML5

<!DOCTYPE html>

 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8" />

    <title>Form Tag in HTML5</title>

</head>

<body>

    <h2>Implementation of &lt;form&gt; Tag In HTML5</h2>

    <form name="form1">

        <table style="width: 50%">

            <caption><strong>Employee registration form</strong></caption>

            <tr>

                <td>

                    <label>EmpName </label>

                </td>

                <td>

                    <input type="text" name="Empname" /></td>

            </tr>

            <tr>

                <td>

                    <label>EmpId </label>

                </td>

                <td>

                    <input type="text" name="Empid" /></td>

            </tr>

            <tr>

                <td>

                    <label>Salary</label>

                </td>

                <td>

                    <input type="text" name="Salary" /></td>

            </tr>

            <tr>

                <td>

                    <label>Job </label>

                </td>

                <td>

                    <input type="text" name="Job" /></td>

            </tr>

            <tr>

                <td>

                    <label>Address </label>

                </td>

                <td>

                    <input type="text" name="Address" /></td>

            </tr>

            <tr>

                <td>

                    <button type="submit" value="Submit">Submit</button></td>

                <td>

                    <button type="reset" value="Reset">Reset</button>

                </td>

            </tr>

        </table>

    </form>

</body>

</html>

Output

form.jpg
 

© 2020 DotNetHeaven. All rights reserved.