HTML FORMS

The <form> Element

The HTML <form> element defines a form that is used to collect user input. An HTML form contains form elements. Form elements are different types of input elements, like text fields, checkboxes, radio buttons, submit buttons and more.

<form>
.
form elements
.
</form>

<input>: element is the most important form element. The <input> element can be displayed in several ways, depending on the type attribute.

Text Input:  <input type=”text”> defines a one-line input field for text input

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

Radio Button Input: <input type=”radio”> defines a radio button. Radio buttons let a user select ONE of a limited number of choices

<form>
  <input type="radio" name="gender" value="male" checked> Male<br>
  <input type="radio" name="gender" value="female"> Female<br>
  <input type="radio" name="gender" value="other"> Other
</form>

The Submit Button: <input type=”submit”> defines a button for submitting the form data to a form-handler. The form-handler is typically a server page with a script for processing input data. The form-handler is specified in the form’s action attribute

<form action="/action_page.php">
  First name:<br>
  <input type="text" name="firstname" value="Mickey"><br>
  Last name:<br>
  <input type="text" name="lastname" value="Mouse"><br><br>
  <input type="submit" value="Submit">
</form>

The Action Attribute: The action attribute defines the action to be performed when the form is submitted. Normally, the form data is sent to a web page on the server when the user clicks on the submit button. In the example above, the form data is sent to a page on the server called “/action_page.php”. This page contains a server-side script that handles the form data.

<form action="/action_page.php">

The Target Attribute:

The target attribute specifies if the submitted result will open in a new browser tab, a frame, or in the current window. The default value is “_self” which means the form will be submitted in the current window. To make the form result open in a new browser tab, use the value “_blank”

<form action="/action_page.php" target="_blank">

The Method Attribute: The method attribute specifies the HTTP method (GET or POST) to be used when submitting the form data

<form action="/action_page.php" method="get">

and

<form action="/action_page.php" method="post">