HTML form attributes

HTML form attribute

HTML forms are crucial for interactive web pages where users can input data. They are defined using the <form> element and can contain various attributes that control their behavior and appearance. Here's a detailed overview of commonly used form attributes:

Action

Specifies the URL where the form data will be submitted. This is typically a server-side script that processes the form input.

Example

<form action="/submit_form.php" method="post">

  <!-- form elements -->

</form>

Method

Defines the HTTP method used to submit the form data. It can be either GET or POST.

Example

<form action="/submit_form.php" method="post">

  <!-- form elements -->

</form>

Target

Specifies where to display the response received after submitting the form. It can be _self, _blank, _parent, _top, or a named iframe.

Example

<form action="/submit_form.php" method="post" target="_blank">

  <!-- form elements -->

</form>

Enctype

Determines how the form data should be encoded before sending it to the server. It is necessary when forms include file uploads.

Example

<form action="/submit_form.php" method="post" enctype="multipart/form-data">

  <!-- form elements including file input -->

</form>

Autocomplete

Controls whether browsers should enable autocomplete for form fields. It can be set to on or off.

Example

<form action="/submit_form.php" method="post" autocomplete="off">

  <!-- form elements -->

</form>

Name

Assigns a unique identifier to the form for scripting purposes.

Example

<form action="/submit_form.php" method="post" name="myForm">

  <!-- form elements -->

</form>

Novalidate

Prevents browser validation of form elements before submission. Useful when implementing custom validation scripts.

Example

<form action="/submit_form.php" method="post" novalidate>

  <!-- form elements -->

</form>

Onsubmit

Specifies a JavaScript function to execute when the form is submitted. Useful for client-side validation or custom behavior.

Example

<form action="/submit_form.php" method="post" onsubmit="return validateForm()">

  <!-- form elements -->

</form>

Onreset

Defines a JavaScript function to execute when the form is reset.

Example

<form action="/submit_form.php" method="post" onreset="resetForm()">

  <!-- form elements -->

</form>

Accept-charset

Specifies the character encoding used when the form is submitted to the server. Defaults to UTF-8.

Example

<form action="/submit_form.php" method="post" accept-charset="UTF-8">

  <!-- form elements -->

</form>

These attributes provide control and flexibility over how forms behave and interact with users and servers on the web. Understanding and using them effectively is key to building robust and user-friendly web forms.