Chapter 17
HTML Forms
HTML forms are used to pass data to a server.
An HTML form can contain input elements like text fields,
checkboxes, radio-buttons, submit buttons and more. A form can also contain
select lists, textarea, fieldset, legend, and label elements.
The <form> tag is used to create an HTML form:
<form>
. input elements . </form> |
HTML Forms - The Input
Element
The most important form element is the <input> element.
The <input> element is used to select user information.
An <input> element can 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.
The most common input types are described below.
Text Fields
<input
type="text"> defines a one-line input field that a user can
enter text into:
<form>
First name: <input type="text" name="firstname"><br> Last name: <input type="text" name="lastname"> </form> |
How the HTML code above looks in a browser:
First name:
Last name:
Last name:
Password Field
<input
type="password"> defines a password field:
<form>
Password: <input type="password" name="pwd"> </form> |
How the HTML code above looks in a browser:
Password:
Radio Buttons
<input type="radio"> defines a radio button. Radio
buttons let a user select ONLY ONE of a limited number of choices:
<form>
<input type="radio" name="sex" value="male">Male<br> <input type="radio" name="sex" value="female">Female </form> |
How the HTML code above looks in a browser:
Male
Female
Female
Checkboxes
<input type="checkbox"> defines a checkbox.
Checkboxes let a user select ZERO or MORE options of a limited number of
choices.
<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br> <input type="checkbox" name="vehicle" value="Car">I have a car </form> |
How the HTML code above looks in a browser:
I have a bike
I have a car
I have a car
Submit Button
<input type="submit"> defines a submit button.
A submit button is used to send form data to a server. The data is
sent to the page specified in the form's action attribute. The file defined in
the action attribute usually does something with the received input:
<form name="input"
action="html_form_action.asp" method="get">
Username: <input type="text" name="user"> <input type="submit" value="Submit">
</form>
|
How the HTML code above looks in a browser:
Username:
If you type some characters in the text field above, and click the
"Submit" button, the browser will send your input to a page called
"html_form_action.asp". The page will show you the received input.
No comments:
Post a Comment