HTML – Form Tag in HTML with Examples

A html form is used to collect data or information from a web page or website.

Data collected under its control can be automatically submitted to a web server. Creating interactive websites for the internet requires capturing user input and processing it.

Captures the user’s input. A form element is enclosed in tags. HTML objects commonly used between tags are ‘text’, ‘password’, ‘buttons’, ‘check box’, ‘radio’, ‘reset’, ‘submit’, ‘hidden’, ‘select’, and ‘text area’. 

All form elements are accessible and their properties can be manipulated to control the functionality of the form at runtime. A form element has properties such as Name, Method, and Action.

Name: it will take the user name as a field.

Method: It will be used to send data captured from different pages. It can be done with Post or Get method. By default, it will take the get method as on the form.

Action:  It will point to the address of the program where the server will process the data. Here it may use serverside scripting languages like ASP, PHP, or JSP.

<form name="form1" method="post" action="submit.php></form>

List of Form Elements/Properties

Elements are used with properties, and properties are defined according to the elements to be used.

• Input – <input><input> tag will be used within the <form></form> tags.
  • Text:

<input type="text">

• • Password:

<input type="password">

• • Button:

<input type="button">

• • Checkbox:

<input type="checkbox">

• • Radio:

<input type="radio">

• • Reset:

<input type="reset">

• • Submit:

<input type="Submit">

• • Hidden:

<input type="hidden">

• • Select:

<select> <option> option 1 </option> <option> option 2 </option> </select>

• • Text area:

<text area> text </text area>

• • File:

<input type="file">

Examples

<input type="text" name="text1" value="search" size="20" maxlenght="64">

<input type="password" name="password" value="" size="20" maxlenght="20">

<textarea name="feedback" rows="20" cols="20"> Enter Feedback </textarea>

<input type="button" name="check" value="verify">
<input type="submit" name="btnsubmit" value="submit">
<input type="rest" name="btnreset" value="reset form">

<input type = “checkbox” name= “employed” value =”yes” checked>

<input type="radio" name="number" value="1" checked>

<select name = “items” size =”2” multiple> 
<option value = “French Fries” Selected> French fries 
<option value = “Hamburgers”> Hamburgers 
<option value = “HotDogs”> Hot Dogs 
</select>