The HTML action attribute specifies the URL of the server-side component where form data will be sent when the form is submitted.
Definition and Usage
➔ This attribute is used within the <form> tag.
➔ The action attribute specifies the destination of the form submission, which is typically a server-side scripting component (e.g., JSP, ASP, Python, Node.js, PHP) that processes data received from the client-side form.
➔ The action attribute can be either an Absolute URL (a complete URL, such as https://w3context.com/data/process_data.jsp) or a Relative URL (relative to the current directory path or base path of the website, such as process_data.jsp or /calc/summary.jsp).
➔ The action attribute works in conjunction with the method attribute, by default the method attribute has a value of GET (which specifies limited data and less secure). The method attribute value POST specifies unlimited data and is secure. So POST is recommended for safer and more data submission.
Example
HTTP GET is used by default.
<form action="/sample.jsp">
Name: <input type="text" name="name"><br>
Email: <input type="text" name="email"><br>
<input type="submit" value="Submit">
</form>
➔ HTTP GET is explicitly used (same as default).
Example
<form action="/sample.jsp" method="GET">
Name: <input type="text" name="name"><br>
Email: <input type="text" name="email"><br>
<input type="submit" value="Submit">
</form>
➔ HTTP POST is explicitly used. Most secure and more data submission
Example
<form action="/sample.jsp" method="POST">
Name: <input type="text" name="name"><br>
Email: <input type="text" name="email"><br>
<input type="submit" value="Submit">
</form>
Example
<!DOCTYPE html>
<html>
<head>
<title>HTML action Attribute Example</title>
<meta charset="utf-8" />
<style>
input[type="submit"] {
width: 150px;
height: 50px;
background-color: #1d2d3d;
font-size: 14pt;
color: white;
border-radius: 5px;
margin-left: 140px;
}
input[type="submit"]:hover {
background-color: #1212ff;
color: white;
}
input {
width: 230px;
height: 30px;
background-color: #fff;
font-size: 14pt;
color: #000;
border-radius: 5px;
margin: 5px;
}
input:hover {
background-color: #c9d9e9;
color: #000;
}
</style>
</head>
<body>
<h2>HTML action Attribute Example</h2>
<p>This is for example purposes only, this example will not allow you to submit values.</p>
<form action="/sample.jsp" method="POST">
Name: <input type="text" name="name"><br>
Email: <input type="text" name="email"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
Click on the "Try it Now" button to see how it works.