Services
|
ONLINE FORMS
EXPLAINED
Online forms are the most
common website add-on out there. You won't visit many sites that
don't contain a form of some kind. You'll forms on contact us
pages, you'll find them as a way for a website to generate leads
such as a mortgage company, just about any reason you would need
someone to send you information is handled through a form.
A Web page form allows users to input and
submit data, such as order information or user information.
Forms include form elements, where users input their data. There
are several types of form elements:
- Text box
- Allows users to enter a line of text.
- Text area
- Allows users to enter multiple lines of text.
- Radio button
- Allows users to select an option from a group of options.
Radio buttons are shown as circles with space in the center
for a dot that indicates the radio button has been selected.
- Checkbox
- Allows users to select options from a group of options.
Checkboxes are shown as squares with space within the
borders for an X that indicates the checkbox has been
selected.
- List
- Allows users to select options from a group of options.
Lists are shown as a drop-down list or a list box.
- Button
- Allows users to click a button to call JavaScript code.
For example, by clicking the Submit button, the user calls
the JavaScript code that submits the form.
|
Text Fields |
| Text fields
allows for
letters & numbers. |
<form>
First name:
<input type="text" name="firstname">
<br>
Last name:
<input type="text" name="lastname">
</form> |
|
| How it looks in a
browser: |
|
|
Radio Buttons |
|
Selecting a specific item from a
list. |
<form>
<input type="radio" name="sex" value="male"> Male
<br>
<input type="radio" name="sex" value="female"> Female
</form> |
|
| How it looks in a
browser: |
|
|
Checkboxes |
|
Select 1 or more items from a
list. |
<form>
I have a bike:
<input type="checkbox" name="vehicle"
value="Bike" />
<br />
I have a car:
<input type="checkbox" name="vehicle"
value="Car" />
<br />
I have an airplane:
<input type="checkbox" name="vehicle"
value="Airplane" />
</form> |
|
| How it looks in a
browser: |
|
|
Drop Down |
|
Select 1 item from a
list. |
<form action="">
<select name="cars">
<option value="none"
selected="selected">Select
A Car</option> <option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="audi">Audi</option>
</select>
</form> |
|
| How it looks in a
browser: |
|
|
Submit |
|
The button to submit all data
from the form. |
<form name="input"
action="html_form_action.asp"
method="get">
Name:
<input type="text" name="user">
<input type="submit" value="Submit">
</form> |
|
| How it looks in a
browser: |
|
|