Essential HTML <form> Attributes

Learn key HTML form attributes: `action`, `method`, `target`, `autocomplete`, and `novalidate`. This tutorial explains how to use them effectively to control form submission, data handling, and user experience.

Essential HTML Form Attributes

This chapter details key attributes for the HTML <form> element, enabling you to customize how forms handle user input and data submission.

action Attribute

The action attribute specifies the URL where form data is sent when submitted. This is typically a server-side script that processes the submitted information.

<form action="/action_page.php" method="post">
  <input type="text" name="fname" placeholder="First Name"><br>
  <input type="text" name="lname" placeholder="Last Name"><br>
  <input type="submit" value="Submit">
</form>

In this example, the data is sent to /action_page.php. If omitted, the data is sent to the current page.

target Attribute

The target attribute specifies where the response from the server after form submission should be displayed. The response might be a new page or an update to the existing page.

Possible values:

• _blank: Opens in a new window or tab.
• _self: Opens in the same window (default).
• _parent: Opens in the parent frame.
• _top: Opens in the entire browser window.
• framename: Opens in a named iframe.

<form action="/submit.php" target="_blank">
  <input type="submit" value="Submit">
</form>

method Attribute

The method attribute specifies the HTTP method used for sending form data: GET or POST. GET appends data to the URL; POST sends data in the request body.

GET Method:

• Appends data to the URL (visible in the address bar – not secure for sensitive data).
• Limited URL length.
• Suitable for bookmarkable results.

POST Method:

• Sends data in the request body (data is not visible in the URL).
• No size limitations.
• More secure; ideal for sensitive data.
• Results are not bookmarkable.

<form action="/submit.php" method="get">  
  <input type="submit" value="Submit (GET)">
</form>
<form action="/submit.php" method="post">  
  <input type="submit" value="Submit (POST)">
</form>

autocomplete Attribute

The autocomplete attribute controls whether the browser should autofill form fields based on the user's previous entries. Values are "on" (default) or "off".

<form autocomplete="off">  
  <input type="text" name="username" placeholder="Username">
  <input type="password" name="password" placeholder="Password">
  <input type="submit" value="Submit">
</form>

novalidate Attribute

The novalidate attribute disables built-in form validation. Use cautiously, as it bypasses client-side checks.

<form novalidate>
  <input type="submit" value="Submit">
</form>

Summary Table