Form in HTML

Form in HTML

HTML forms are used to pass data to a server. A form can contain input elements like text fields, checkboxes, radio-buttons, submit buttons and more. A form can also contain select lists, textarea, fieldset, legend, and label elements. The <form> tag is used to create an HTML form:

<form method="post" name="frm1"> 
<label>User Name</label>
<input type="text" name="uname"/>
<input type="submit" value="Submit"/>

Attributes of <form> element

1. action :- It defines the process to be performed when the form is submitted.


<form action=“login_validate.php”>

2. target :- It specifies where to open result after submitting the form. It can have value:

  • _self :- The result will be displayed in same tab. It is default value.
  • _blank :- in new tab.
  • _top :- in the entire browser window i.e. “breaks out of all frames”.
  • _parent :- in the parent of the current frame.


<form target=“_blank”>

3. method :- It specifies the HTTP method to be used when submitting the form data. It can have value:

  • get :- It is default value. It is not secure method because the submitted form’s data will be visible in the address field of the browser.
  • post :- We must use post method when form contains sensitive or personal information because it does not display the submitted form data in the address field of the browser. 


<form method=“post”>

HTML Forms – Controls/Elements

The most important form element is the input element. The input element is used to select user information. An input element can vary in many ways, depending on the type attribute. An input element can be of type text field, checkbox, password, radio button, submit button, and more. The most used input types are described below.

<label> element

This element is used to define label or naming of form elements. It provide a usability improvement for mouse users i.e. if a users clicks on the text within the <label> element, it toggles the control associated with it.

Text Fields

<input type="text" /> defines a one-line input field that a user can enter text into:

First name: <input type="text" name="firstname" /><br />
Last name: <input type="text" name="lastname" />

Password Field

<input type="password" /> defines a password field:
Password: <input type="password" name="pwd" />

Radio Buttons

<input type="radio" /> defines a radio button. Radio buttons let a user select ONLY ONE of a limited number of choices:

<input type="radio" name="sex" value="male" />
Male<br /><input type="radio" name="sex" value="female" /> Female


<input type="checkbox" /> defines a checkbox. Checkboxes let a user select ONE or MORE options of a limited number of choices.

<input type="checkbox" name="vehicle" value="Bike" /> I have a bike<br /> <input type="checkbox" name="vehicle" value="Car" /> I have a car

Submit Button

<input type="submit" /> defines a submit button.

A submit button is used to send form data to a server. The data is sent to the page specified in the form's action attribute. The file defined in the action attribute usually does something with the received input:

<form name="input" action="html_form_action.asp" method="get"> 
Username: <input type="text" name="user" />
<input type="submit" value="Submit" />


Textarea: How to create a multi-line text input control. In a text-area the user can write an unlimited number of characters.

<textarea> text</textarea>

Attribute of <textarea> tag:

  • Rows to set the how many no. of rows display
  • Cols to set the how many no. of column display


<textarea rows=”6” cols=”20”></textarea>

Example Programs

Program [1]

Write a HTML program to create a form for the subscription of a magazine. The form should contain Name, Address, City, State, Pin Code. Magazine should be selected from 5 different magazines using checkbox. Subscription is available for 1 year or two years. Radio buttons shall be used to select subscription period. The page should have a submit button.

View Solution

CCC Online Test 2021 CCC Practice Test Hindi Python Programming Tutorials Best Computer Training Institute in Prayagraj (Allahabad) O Level NIELIT Study material and Quiz Bank SSC Railway TET UPTET Question Bank career counselling in allahabad Website development Company in Allahabad Sarkari Exam Quiz