In this we will see various HTML form attribute.
action attribute defines the action after submitting the form.
Data sends to the server when user click on submit button.
The action attribute value defines the web page where information proceed. It can be .php, .jsp, .asp, etc. or any URL where you want to process your form.
Tip: If the
action attribute is omitted, the action is set to the current page.
target attribute defines where to open the response after submitting the form. The following are the keywords used with the target attribute.
target attribute can have one of the following values:
|_blank||The response is displayed in a new window or tab|
|_self||The response is displayed in the current window|
|_parent||The response is displayed in the parent frame|
|_top||The response is displayed in the full body of the window|
|framename||The response is displayed in a named iframe|
The default value is
_self which means that the response will open in the current window.
<form action="action.html" method="get" target="_blank">
method attribute specifies the HTTP method to be used when submitting the form data.
The form-data can be sent as URL variables (with
method="get") by default is
get or as HTTP post transaction (with
Example for get
<form action="/action_page.php" method="get">
Example for post
<form action="/action_page.php" method="post">
Notes on GET:
- Appends the form data to the URL, in name/value pairs
- NEVER use GET to send sensitive data! (the submitted form data is visible in the URL!)
- The length of a URL is limited (2048 characters)
- Useful for form submissions where a user wants to bookmark the result
- GET is good for non-secure data, like query strings in Google
Notes on POST:
- Appends the form data inside the body of the HTTP request (the submitted form data is not shown in the URL)
- POST has no size limitations and can be used to send large amounts of data.
- Form submissions with POST cannot be bookmarked
Tip: Always use POST if the form data contains sensitive or personal information! like in registration for or login form because this forms contains password field.
The HTML autocomplete attribute enables an input field to complete automatically.
It can have two values “on” and “off” which enables autocomplete either ON or OFF. The default value of autocomplete attribute is “on”.
<form action="/action_page.php" autocomplete="on">
novalidate attribute is a boolean attribute.
When present, it specifies that the form-data (input) should not be validated when submitted.
In the following example, the email field is there. That’s means the user must put a valid email (we will also discuss the email field). But if we write
novalidate attribute then the form allows submitting the email field without checking whether it is a valid email or not.
try this example by removing
enctype attribute defines the encoding type of form-content while submitting the form to the server. The possible values of enctype can be
<form action="action.html" method="post" enctype="multipart/form-data">
Useful when submit image with file input.
List of All <form> Attributes
|accept-charset||Specifies the character encodings used for form submission|
|action||Specifies where to send the form-data when a form is submitted|
|autocomplete||Specifies whether a form should have autocomplete on or off|
|enctype||Specifies how the form-data should be encoded when submitting it to the server (only for method=”post”)|
|method||Specifies the HTTP method to use when sending form-data|
|name||Specifies the name of the form|
|novalidate||Specifies that the form should not be validated when submitted|
|rel||Specifies the relationship between a linked resource and the current document|
|target||Specifies where to display the response that is received after submitting the form|
Hope you enjoyed. happy coding 🙂
Previous: #21 HTML Forms – Basic
Next: #23 HTML Form Elements