Articles → HTML → Forms In HTML

Forms In HTML

In this article, we will discuss form element in HTML

Purpose

Form tag contains the HTML controls like textbox, textarea, drop down etc that is used for collecting data and send data to server for processing.

Syntax

<form method="" action="">
  </form>

Action Attribute

Action attribute specifies the web page where data is sent for processing (once submitted).

Method Attribute

Let us first discuss some basics. If you are browsing a website through web browser hosting on some machine then your web browser is a client and the machine where website is hosted is a server.

Client application sends a request to the server and in return server sends the response to the client.

To understand this let us consider an example of a website which contains a registration form. User enters the details and clicks on submit button. When the button is clicked it means that client is sending data to the server for inserting data into the database. In other words this is the request from the client to the server. Server receives the request and then it does an action on data i.e. insert it into database. Once the transaction is done, server sends response to the client (i.e. web browser) whether the transaction is successful or not.

There are 2 methods in which client and server can communicate with each other

Get
Post

Get → In Get method client requests information from the server by sending parameters. Those parameters are appended with URI separated by question mark (?).

Post → Unlike Get (which appends parameters in URL), post sends the parameter in the body of HTTP request. The parameters are not visible to users and therefore can be used to send sensitive information.

So method attribute describes the method of sending data to server. Method attribute has 2 permissible values

Get
Post

Example

<html>
<head>
    <title>Form Demo</title>
</head>
<body>
   <form method="get" action="Page1.html">
   </form>
   
</body>
</html>

Browser Support

Internet Explorer	Firefox	Chrome	Safari	Opera	Edge
Yes	Yes	Yes	Yes	Yes	Yes

Posted By -	Karan Gupta

Posted On -	Friday, November 4, 2016

Updated On -	Sunday, November 26, 2017

Query/Feedback

Your Email Id

Subject

Query/Feedback	Characters remaining 250