HTML Form Action


The action is an attribute of <form> element that specifies the url of the second web page. The second page receives the form-data from the first page after the submission of a form.

Syntax

<form action="URL of page"> .............. </form>  

This attribute specifies the URL of a web page as its value which receives the information of the form filled by the user.

Example

<!DOCTYPE html>  
<html>  
<head>  
<title>  
Example of HTML form action  
</title>  
<meta name="viewport" content="width=device-width, initial-scale=1">  
<style>  
body{  
font-family: Calibri, Helvetica, sans-serif;  
background-color: pink;  
}  
.container {  
padding: 50px;  
background-color: lightblue;  
}  
  
input[type=text] {  
  width: 100%;  
  padding: 15px;  
margin: 5px 0 22px 0;  
display: inline-block;  
 border: none;  
 background: #f1f1f1;  
}  
input[type=text]:focus {  
background-color: orange;  
outline: none;  
}  
 div {  
         padding: 10px 0;  
              
}  
.registerbtn {  
  background-color: #4CAF50;  
  color: white;  
  padding: 16px 20px;  
  margin: 8px 0;  
  border: none;  
  cursor: pointer;  
  width: 100%;  
  opacity: 0.9;  
}  
.registerbtn:hover {  
opacity: 1;  
}  
</style>  
</head>  
<body>  
<div class="container">  
<center>  <h1> Student Registeration Form</h1> </center>  
<form action="jp.html" method="post">  
<label> Firstname </label>   
<input type="text" name="firstname" placeholder= "Firstname" size="15" required />   
  
<label> Lastname: </label>    
<input type="text" name="lastname" placeholder="Lastname" size="15"required />   
<div>  
  
<label>   
Gender :  
</label><br>  
<input type="radio" value="Male" name="gender" checked > Male   
<input type="radio" value="Female" name="gender"> Female   
<input type="radio" value="Other" name="gender"> Other  
  
<div>  
<label>   
Phone :  
</label>  
<input type="text" name="phone" placeholder="phone no." size="10" required>   
</div>  
<button type="submit" class="registerbtn">Register</button>    
</form>  
After click on the submit button, the values of form are sent to the jp.php page with the help of a server. If you want to learn the process of a server, then click on this url: https://www.javatpoint.com/php-form  
</body>  
</html>  

Leave a Reply

Your email address will not be published. Required fields are marked *