HTML FormsHTML Forms are used to pass data to a server. The most important form element is the the input element. The input element is used to select user information. An input element can be 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. A form can also contain select lists , textarea, fieldset, legend and label elements.
There are many attributes of form syntax such as name, method, action .
For example<html>
<head>
<title> The nineth lesson </title>
</head>
<body>
<form name=”student” action=”student.php” method=”post” >Input elements</form></body>
</html>
Input elementsInput elements are very important to select user information. Normally, these input elements will be send to server side. The server will take action whether to save the information or display information of users.
There are many input elements can be added in HTML Forms. Several of them are textfield, checkbox, password, radio button, submit button and more.
TextfieldTextfield allow user to enter text into one-line input field.
<form>First name : <input type =”text” name=”firstname”/></form>
CheckboxCheckbox element allow user to select ONE or MORE options of a limited number of choices.
<form><input type ="checkbox" name="vehicle" value="Mawar" /> Mawar <br/><input type ="checkbox" name="vehicle" value="Teratai" /> Teratai <br/></form>
Password fieldPassword field almost same to the textfield. But when user enter text into one-line input filed, it will display in asterisk character.
<form>Password : <input type =”passwordt” name=”pass”/></form>
Radio button
Radio button allow user to select ONLY ONE option of a limited number of choices.
<form><input type ="radio" name="sex" value="male" /> Male <br/><input type ="radio" name="sex" value="female" /> Female <br/></form>Submit button
Submit button allow user to pass user information to server side.
<form><form name=”student” action=”student.php” method=”post” >Username : < input type="text" name="user" /><input type="submit" value="Submit" /></form>
Drop down list
Drop down list allow user to choose one of many options.
Below is the simple example drop down list.
<form action=""><select name="cars"><option value="volvo">Volvo</option><option value="saab">Saab</option><option value="fiat">Fiat</option><option value="audi">Audi</option></select></form>
Below is the simple example drop down list with a pre-selected value.
<form action=""><select name="cars"><option value="volvo">Volvo</option><option value="saab">Saab</option><option value="fiat" selected="selected">Fiat</option><option value="audi">Audi</option></select></form>
Textarea
Textarea allows user to write unlimited number of characters. This textarea will be add in HTML Forms.
<textarea rows="10" cols="30"> The cat was playing in the garden. </textarea>
Conclusion.
HTML Form Tags
| Tag | Description |
| <form> | Defines an HTML form for user input |
| <input /> | Defines an input control |
| <textarea> | Defines a multi-line text input control |
| <label> | Defines a label for an input element |
| <fieldset> | Defines a border around elements in a form |
| <legend> | Defines a caption for a fieldset element |
| <select> | Defines a select list (drop-down list) |
| <optgroup> | Defines a group of related options in a select list |
| <option> | Defines an option in a select list |
| <button> | Defines a push button |
