HTML <form> method attribute

The HTML <form> tag

Definition and usage

method Attributes specify how to send form data (form data will be sent to the page specified by the action attribute).

Form data can be sent as URL variables (using method="get") or as an HTTP POST transaction (using method="post").

Description of GET:

  • Attach form data in the form of name/value pairs to the URL
  • The URL has a length limit (about 3000 characters)
  • Do not use GET to send sensitive data! (It will be visible in the URL)
  • It is very useful for form submissions where users want to add the results as bookmarks
  • GET is more suitable for non-secure data, such as query strings in Google.

Description of POST:

  • Attach form data in the body of the HTTP request (data will not be displayed in the URL).
  • No size limit.
  • Forms submitted using POST cannot be added to bookmarks.

Instance

Example 1

Submit the form using the "get" method:

<form action="/action_page.php" method="get">
  <label for="fname">Name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Surname:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Submit">
</form>

Try it yourself

Example 2

Submit the form using the "post" method:

<form action="/action_page.php" method="post">
  <label for="fname">Name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Surname:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Submit">
</form>

Try it yourself

Syntax

<form method="get|post">

Attribute value

Value Description
get Default. Attach form data in the form of name/value pairs to the URL: URL?name=value&name=value.
post Send form data as an HTTP POST transaction.

Detailed explanation of the method attribute

The browser sends the data in the form of the method set by the method attribute to the server for processing. There are two methods: POST method and GET method.

If the POST method is used, the browser will send data in the following two steps. First, the browser will establish contact with the form processing server specified in the action attribute, and once the connection is established, the browser will send the data to the server in a segmented transmission method.

On the server side, once a POST-style application begins to execute, parameters should be read from a marked position, and once parameters are read, these parameters must be decoded before the application can use these form values. The server for the user specifically specifies how the application should accept these parameters.

Another situation is to use the GET method, at which point the browser establishes a connection with the form processing server, and then sends all the form data directly in a single transmission step: the browser attaches the data directly after the form's action URL. These two are separated by a question mark.

General browsers can transmit form information using either of the above methods, while some servers only accept data provided by one of the methods. You can specify in the method attribute of the <form> tag the method that the form handling server should use to process the data, making it POST or GET.

POST or GET?

If the form handling server supports both POST and GET methods, which method should you choose? Below are some rules regarding this matter:

  • If you want to achieve the best form transmission performance, you can use the GET method to send small forms with only a few brief fields.
  • Some server operating systems limit the number and length of command-line parameters that can be immediately passed to the application, so in this case, for forms that have many fields or long text fields, the POST method should be used to send them.
  • If you are not experienced in writing server-side form handling applications, you should choose the GET method. If you use the POST method, you will need to do some additional work in reading and decoding the method, which may not be difficult, but you may not be willing to deal with these issues.
  • If security is a concern, we recommend using the POST method. The GET method places the form parameters directly in the application's URL, making it easy for network sniffers to capture them and also to extract them from the server's log files. If sensitive information such as credit card account numbers is included in the parameters, it can inadvertently compromise user security. On the other hand, POST applications do not have security vulnerabilities, and at least encryption methods can be used when transmitting parameters as separate transactions for server processing.
  • If you want to call a server-side application outside of the form and include the process of passing parameters to it, you should use the GET method, as this method allows parameters such as forms to be included as part of the URL. On the other hand, applications using POST style would like to have an additional transmission process from the browser after the URL, with the content of the transmission not being part of the content of the traditional <a> tag.

Explicitly passing parameters

Some of the suggestions mentioned earlier can also be considered as an explanation for choosing this method. Suppose you have a very simple form that only contains the parameters x and y. When encoding the values of these elements, they are in the form shown below:

x=28&y=66

If the form uses method=GET, the URL to refer to the server-side application will be as follows:

http://www.example.com/example/program?x=28&y=66

At any time, we can create a traditional <a> tag, using it to call a form with the required parameter values, as shown below: 

<a href="http://www.example.com/example/program?x=28&y=66">

The only problem is that the & symbol used to separate parameters is also the insertion symbol in character entities. If an & symbol is placed in the href attribute of the <a> tag, the browser will replace the characters following it with the corresponding character entity.

To prevent this from happening, we must replace the & symbol with its entity equivalent, that is, with "&" or "&". After the replacement, the above non-form example referencing the server application will look like this:

<a href="http://www.example.com/example/program?x=28&y=66">

Since it is still not possible to use the & symbol in URLs and it may cause confusion in the future, we encourage servers to also accept semicolons as parameter separators. You can also check your server documentation to see if your server supports this feature.

Browser Support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support

The HTML <form> tag