HTML method Attribute

HTML method Attribute

The HTML method attribute specifies how a <form> submits its data. It can also be used with a form inside a <dialog> to close the dialog without submitting the form data to a server.

Elements That Use the method Attribute

The method attribute is used with the <form> element.

method Values

The method attribute is an enumerated attribute. The commonly used values are get, post, and dialog.

If method is omitted or contains an invalid value, the form uses get.

Using the get Method

The get method submits form data by adding the name-and-value pairs to the destination URL as a query string. It is commonly used when submitting a form retrieves or searches for information without changing data on the server.

<form action="/search.html" method="get">
  <label for="search">Search:</label>
  <input type="search" id="search" name="q">
  <button type="submit">Search</button>
</form>

A submitted value might produce a URL similar to /search.html?q=html. Because the submitted values become part of the URL, get should not be used when form data is sensitive.

Using the post Method

The post method sends the form data in the body of the HTTP request instead of appending it to the destination URL.

<form action="form-result.php" method="post">
  <label for="name">Name:</label>
  <input type="text" id="name" name="name">
  <button type="submit">Submit</button>
</form>

The post method is commonly used when a submission creates or changes data, sends larger amounts of data, or should not place the submitted values in the URL. Using post does not by itself encrypt the submitted data; HTTPS is required to protect data while it travels between the browser and server.

Using the dialog Method

The dialog value is used with a form inside a <dialog> element. Submitting the form closes the dialog without submitting the form data to a server.

<dialog open>
  <form method="dialog">
    <p>Close this dialog?

    <button value="cancel">Cancel</button>
    <button value="confirm">Confirm</button>
  </form>
</dialog>

The value of the submit button can be used as the dialog's return value. The dialog method is intended for dialog interaction rather than HTTP form submission.

method and formmethod

The method attribute establishes the form's normal submission method. A submit button can use the formmethod attribute to override that method for a particular submission.

<form action="form-result.php" method="post">
  <input type="text" name="search">
  <button type="submit">Submit with POST</button>
  <button type="submit" formmethod="get">Submit with GET</button>
</form>

In this example, the first button uses the form's post method, while the second button overrides it and submits using get.

Common Mistakes

Do not use get for sensitive form data. Values submitted with get become part of the URL and can appear in browser history, logs, bookmarks, and other locations.

Do not assume that post makes submitted data secure. Use HTTPS when form data needs protection while it is transmitted.

Do not confuse method with formmethod. The method attribute belongs to the <form> element, while formmethod can override the form's method from a submit control.

Do not use method="dialog" for a form that needs to send its data to a server. The dialog value closes the containing dialog instead of performing an HTTP submission.

Browser Support

Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.

The method attribute on the <form> element and its established form-submission behavior are widely supported in current core browsers.

Checking Browser Support

For current browser compatibility information, visit Can I Use? . Search for the HTML element or attribute you want to check. You can also narrow your search by entering an element name and attribute name separated by a colon. Search results can include related HTML features, element attributes, input types, APIs, and other technologies, so select the result that most closely matches the feature you are checking.

Try the method Attribute

The example uses method="get" so you can see how submitted form data is added to the destination URL. Enter a search term and submit the form.

Summary

The HTML method attribute specifies how a <form> behaves when submitted. The get method places submitted data in the destination URL, post sends it in the request body, and dialog closes a containing dialog without sending the form data to a server.