HTML form Attributes

In this chapter you will learn about HTML <form> element attributes.

action attribute

It is a URL where form data is processed. If action attribute value is blank then form will be processed to the same page.

<form action="action.html" method="post">
    <label>User Name:</label><br>
    <input type="text" name="name"><br><br>
    <label>User Password</label><br>
    <input type="password" name="pass"><br><br>
    <input type="submit">
</form>

When you click submit button in above example it will take you to action attributes URL. The form data is sent to a file on the server when the user clicks on the submit button.

The action attribute defines the action to be performed when the form is submitted.

method attribute

The method attribute defines the HTTP method that is used to submit the form.

post method

It does not display the submitted data in URL.

<form action="action.html" method="post">  

get method

The get value of method attribute is default value while submitting the form. This is not secure as it displays data in URL (in name/value pairs) after submitting the form.

<form action="action.html" method="get">  

It will show form data like action.html?name=TheNewTutorial&pass=123  

target attribute

The target attribute defines where to open the response after submitting the form. 

• _self: The response will display in current page only.

<form action="action.html" method="get" target="_self">  

• _blank: It will load the response in a new page (new window or tab).

<form action="action.html" method="get" target="_blank">  

• framename: The response is displayed in a named iframe.
• _parent: The response is displayed in the parent frame.
• _top: The response is displayed in the full body of the window.

autocomplete attribute

The HTML autocomplete attribute is a newly added attribute of HTML5. It 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”.

It can be used with <form> element and <input> element both.

<form action="action.html" method="get" autocomplete="off">  

<form action="action.html" method="get" autocomplete="on">  

enctype attribute

The HTML enctype attribute defines the encoding type of form-content while submitting the form to the server. It can have value from following.

• application/x-www-form-urlencoded: It is default encoding type if the enctype attribute is not included in the form. All characters are encoded before submitting the form.

<form action="action.html" method="post" enctype="application/x-www-form-urlencoded" >

• text/plain (HTML5): In this encoding type only space are encoded into + symbol and no any other special character encoded.

<form action="action.html" method="post" enctype="text/plain" >  

• multipart/form-data: It does not encode any character. It is used when our form contains file-upload controls.

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

novalidate attribute

The novalidate attribute is newly added Boolean attribute of HTML5.

If you apply this attribute in form then it does not perform any type of validation and submit the form.

Example

<form action = "action.html" method = "get" novalidate>