In this tutorial you will learn HTML form elements. The HTML form elements are used to get user inputs. There are various different types of form elements that are used to get input from the user. These are checkbox, drop-down, submit button, and many more.
Example HTML Form Elements:
<form action="action.php" method="POST">
<label for="textbox">Text Box</label><br>
<input type="text" name="textbox"><br><br>
<label for="password">Password Input</label><br>
<input type="password" name="password"><br><br>
<label for="textbox">Text Area</label><br>
<textarea name="textarea"></textarea><br><br>
<label for="dropdown">Dropdown</label><br>
<select id="dropdown">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select><br><br>
<label for="checkbox">Checkbox</label><br>
<input type="checkbox" name="checkbox"><br><br>
<label for="radio">Radio Select</label><br>
<input type="radio" name="radio">
<input type="radio" name="radio">
<input type="radio" name="radio"><br><br>
<label for="file">File</label><br>
<input type="file" name="file"><br><br>
<input type="submit" value="Submit Button">
</form>The <input> Element
The input Element field defines to specify the user to enter data. An input element is use within the element to specify input controls which allow the users to enter data in the input field. And the input field has many types depending on the HTML attributes. However, The is an empty element that only contains attributes. To explain the labels for the input element, to be use.
<form action="/action.php"> <label for="fname">First name:</label><br> <input type="text" id="fname" name="fname"><br><br> <input type="submit" value="Submit"> </form>
The <select> Element
The <select> element is drop-down a specific list where users can select an item. To create a drop-down items by using <select> tag. In HTML you can represent drop-down items inside of <select> tag. Then you can put <option> between <select> tag as well. Just take a look at example:
<select id="cars" name="cars"> <option value="sedan">Sedan</option> <option value="coupy">Coupy</option> <option value="Minivan">Minivan</option> <option value="audi">Audi</option> </select>
The <textarea> HTML Form Element
The tag is used to get a text from the user input. You can get the highest amount of text by using the Textarea field. Just take a look at an example:
<textarea name="message" rows="10" cols="30"> The Dog was playing in the garden. </textarea>
The Radio Input:
The radio input allows the user to input specified amount of options to the select form. You can suppose this like a multiple choice for the user. The user can select one of the option from the radio options. So, take a look at example:
<input type="radio" name="weapon" value="throwing_stars"> Throwing Stars<br> <input type="radio" name="weapon" value="sword"> Sword<br> <input type="radio" name="weapon" value="staff"> Staff<br>