HTML Forms

HTML form is used to collect different kind of inputs from user it will collect data from the user and than it will post it to back-end application for further processing.

HTML forms contain different input elements like text fields, check box, radio buttons and many more these are also known as html controls.

HTML Form Element

The html form element is the main tag to create the form in webpage. This element starts from <form> and end with </form>. Basically the form element contains all other input elements like text fields, buttons and more to get input for user.

HTML Forms Syntax

<form action="url" method="GET/POST">
     form elements will be written between these tags
</form>
<!DOCTYPE html>
<html>
<body>

<h2>HTML Forms</h2>

<form action="">
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname" value="Enter Your First Name"><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname" value="Enter Your Last Name"><br><br>
  <input type="submit" value="Submit">
</form> 
</body>
</html>
HTML Forms

The above example is very basic example of html form in which we are not passing any data. Now before moving ahead we will see some basics html forms attributes so that it become more clear that how html form element actually works.

HTML Form Attributes

AttributeDescription
actionAs the form only allow us to take input data from user so in action attribute backend script is attached to process the data. It basically directs the page after form submission.
methodFor uploading data some methods are used such as Get or Post.
targetIt indicates where to display response after submitting the form.

Visit HTML Attribute to study form attributes in detail.

HTML Form Controls

There are different kind of form controls which can be used to get input from user as in above example we use text fields to get data from user now we will some other form controls.

  • Text input Controls
  • Checkboxes Controls
  • Radio Box Controls
  • Select Box Controls
  • File Select Boxes
  • Hidden Controls
  • Clickable Buttons
  • Submit and Reset Buttons

These above are the different form controls to get the input from user these controls and form elements will be discussed in further section in detail.

Comments are closed.