HTML forms are used to get the user data. HTML form action POST and GET are the action attribute of the form the element specifies the URL of the server-side script that will process the data submitted by the form.
- GET method – Used to request data from a specified resource with appended to the URL as a query string. The query string consists of the form field names and values, separated by
&characters, and preceded by a?character. The data is visible in the URL bar of the user’s browser and can be bookmarked or shared easily. - POST method – Used to send data to a server to update a resource using the body of the HTTP request, rather than as part of the URL. This data is not visible in the URL bar of the user’s browser, and cannot be bookmarked or shared easily.
GET and POST are two of the most commonly used HTTP methods in web applications for retrieving or submitting data.
HTML form action post and GET examples
Simple example code of an HTML form that uses the GET method:
<!DOCTYPE html>
<html>
<body>
<form method="get" action="https://tutorial.eyehunts.com/?s=">
<input type="search" name="location" placeholder="Search.." />
<input type="submit" value="Go" />
</form>
</body>
</html>Output:
Using the HTTP POST method to send data to the server for further processing.
<!DOCTYPE html>
<html>
<body>
<form action="https://eyehunts.com/contact-us/" method="POST">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<label for="email">Email:</label>
<input type="email" id="email" name="email">
<button type="submit">Submit</button>
</form>
</body>
</html>HTML form action POST vs GET
| GET | POST |
|---|---|
| Data sent with the GET method is visible in the URL. | Data sent with the POST method is not visible. |
| GET requests can be bookmarked. | POST requests can’t be bookmarked. |
| GET requests can be cached. | POST requests can’t be cached. |
| GET requests to have a character limit of 2048 characters. | POST requests do not have a limit. |
| Only ASCII characters are allowed in GET requests. | All data is allowed in a POST request |
Comment if you have any doubts or suggestions on this JS HTML Form code.
Note: The All JS Examples codes are tested on the Firefox browser and the Chrome browser.
OS: Windows 10
Code: HTML 5 Version