HTML Form Attributes

In this chapter, you will find a detailed description of the various attributes available for the HTML element.

List of All HTML Forms Attributes:

Attribute	Description
accept-charset	Indicate the character encodings used for form submission
action	Indicate where to send the form-data when a form is submitted
autocomplete	Indicate whether a form should have autocomplete on or off
enctype	Indicate how the form-data should be encoded when submitting it to the server (only for method="post")
method	Indicate the HTTP method to use when sending form-data
novalidate	Indicate where to display the response that is received after submitting the form
rel	Indicate that the form should not be validated when submitted
target	Indicate the relationship between a linked resource and the current document
name	Indicate the name of the form

The Action Attribute

The action attribute in HTML forms specifies the URL where the form data will be submitted upon submission.

Example:

<!DOCTYPE html>
<html>

<head>
    <title>HTML Forms</title>
</head>

<body>
    <form action="submit_form.php">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name">
        <input type="submit" value="Submit">
    </form>
</body>

</html>

Output:

The Target Attribute

The target attribute determines the browsing context or the frame in which the response from submitting the form will be displayed.

Example:

<!DOCTYPE html>
<html>

<head>
    <title>HTML Forms</title>
</head>

<body>
    <form action="submit_form.php" target="_blank">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name">
        <input type="submit" value="Submit">
    </form>
</body>

</html>

Output:

target Attribute Values

Value	Description
_blank	This action opens the linked document in a new window or tab
_self	By default, the linked document opens in the same frame it was clicked.
_parent	This command will open the document that is linked to the parent frame.
_top	The linked document will be displayed in the full body of the window when opened.
framename	The instruction states that the document linked to it should be opened in the specified iframe mentioned in the text.

The Method Attribute

The method attribute specifies the HTTP method used when submitting the form data.
It defines how the data is sent to the server for processing.

Example:

<!DOCTYPE html>
<html>

<head>
    <title>HTML Forms</title>
</head>

<body>
    <form action="submit_form.php" method="post">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name">
        <input type="submit" value="Submit">
    </form>
</body>

</html>

Output:

Types of HTML Form Method Attribute:

GET Method: The GET method appends form data to the URL as query parameters. It is commonly used for retrieving data from the server.
POST Method: In contrast, the POST method sends form data in the request body, making it suitable for transmitting sensitive or large amounts of data securely.

The Autocomplete Attribute

The autocomplete attribute specifies whether the autocomplete functionality in the HTML Forms is on or off
The autocomplete automatically fills the input values in the form.

Example:

<!DOCTYPE html>
<html>

<body>

    <h1>The autocomplete attribute</h1>


    <form action="submit_form.php" method="post" autocomplete="on">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name"><br><br>
        <label for="name">Password:</label>
        <input type="text" id="password" name="password"><br><br>
        <input type="submit" value="Submit"><br>
    </form>

</body>

</html>

Output: