This content originally appeared on DEV Community and was authored by wasifali
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.
This content originally appeared on DEV Community and was authored by wasifali