HTML Form Attributes

HTML <form> elements contain several attributes that define how form data is collected, processed, and submitted. These attributes control important aspects such as where and how the data is sent, how it is encoded, and how the form behaves during submission.

The action Attribute

Specifies the URL or file that will handle the form submission.
When the user clicks the submit button, the form data is sent to this location.

<form action="/samples/form_processor.php">
  <input type="text" name="username">
  <input type="submit">
</form>

If the action attribute is omitted, the form submits to the same page it’s currently on.

The method Attribute

Defines the HTTP method used to send form data.
There are two common methods:

• GET – Data is appended to the URL (visible in the address bar).
• POST – Data is sent in the request body (not visible in the URL).

<form action="/samples/form_processor.php" method="post">
  <input type="text" name="email">
  <input type="submit" value="Submit">
</form>

The target Attribute

Specifies where to display the response after submitting the form.

<form action="/samples/form_processor.php" target="_blank">
  <input type="text" name="query">
  <input type="submit" value="Search">
</form>

The enctype Attribute

Specifies how the form data should be encoded before sending it to the server.
It is mainly used with the POST method.

<form action="/samples/form_processor.php" method="post" enctype="multipart/form-data">
  <input type="file" name="fileUpload">
  <input type="submit" value="Upload">
</form>

The autocomplete Attribute

Enables or disables autocomplete for all input fields inside a form.

<form autocomplete="off">
  <input type="text" name="name" placeholder="Full name">
  <input type="email" name="email" placeholder="Email address">
  <input type="submit">
</form>

You can also set autocomplete on individual input fields.

The novalidate Attribute

Disables form validation when submitting.
This is useful during testing or when validation is handled via JavaScript.

<form action="/samples/form_processor.php" novalidate>
  <input type="email" name="email" placeholder="Enter your email">
  <input type="submit">
</form>

The name Attribute

Assigns a name to the form.
This is often used to reference the form in JavaScript.

<form name="registrationForm">
  <input type="text" name="username">
  <input type="submit">
</form>

The rel Attribute

Defines the relationship between the current document and the target resource when the action points to another URL.

<form action="/samples/form_processor.php" rel="external">
  <input type="text" name="data">
  <input type="submit">
</form>

The accept-charset Attribute

Specifies the character encodings the server should expect for submitted form data.

<form action="/samples/form_processor.php" accept-charset="UTF-8">
  <input type="text" name="comment">
  <input type="submit">
</form>

Example: Various Form Attributes

<form action="/samples/form_processor.php" method="post" target="_self"
      enctype="multipart/form-data" autocomplete="on" name="userForm">
  
  <label>Full Name:</label>
  <input type="text" name="fullname" required><br><br>

  <label>Email:</label>
  <input type="email" name="email" required><br><br>

  <label>Profile Picture:</label>
  <input type="file" name="profile_pic"><br><br>

  <label>Message:</label><br>
  <textarea name="message" rows="4" cols="30"></textarea><br><br>

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

Browser Support

Chrome	Edge	Firefox	Safari	Opera	IE9+
Yes	Yes	Yes	Yes	Yes	Yes

Conclusion

HTML form attributes define how form data is sent and processed.
By understanding and combining attributes like action, method, enctype, and target, developers can control form behavior precisely and build robust user input systems.