|
Ramapo Masters of Science
in Educational Technology
Tools and Concepts of Data Analysis:
Dataweb
Introduction to Form Elements (home)
Overview | Element Overview |
Adding Elements
One-Line Text Boxes |
Scrolling Text Boxes | Check Boxes
Option Buttons | Drop-down Menus
Form Elements: Overview
Forms and form elements are used to collect information from a web page.
Elements include one-line text boxes, scrolling text boxes, check boxes,
radio buttons, drop down menus, and push buttons. Each type of form
element has its own unique properties, uses, and options. The form
element chosen depends on the type of data that you wish to collect.
Points to Remember
All form elements must be inside the form if they are to work correctly
Removing an element from within the form boundaries will cause problems.
Replacing them may not correct the problem.
Each form should contain one submit button and one reset button.
To make more room in the form, place your cursor in front of the submit
and reset buttons and hit enter.
Tables can be placed in forms and forms in tables, but do not confuse
the function of each. Top | Home
Available Form Elements Include
One line text box - for short user typed data (i.e. - first name)
Scrolling text box - for longer user typed data (i.e. - comments)
Check Box - to select any number of possible combinations from a logical
group (i.e. - check each of the following movies you have seen.) Keep in
mind that you see these items as a logical group. The computer will
interpret them as completely separate entities
Radio Button - to select one choice from 2 or more options (i.e. - Which
of the following is your favorite movie)
Drop Down Menu - to choose one or more choices from a predefined list (i.e.
- your homeroom teacher or classes you have previously taken)
Top | Home
Adding Form Elements
Insert | Form | Choose the desired element
Form Properties One-Line Text Boxes
Name - must follow computer friendly naming conventions (CFN)
Value - The value of a one-line text box is whatever the user types. If
the user fails to enter any information, an empty or null value is
returned.
Initial Value This optional field would make the box appear with text
already entered. The user could erase this text and enters their own.
This box is rarely if ever used. In most cases you will leave it blank.
Width in Characters dictates the size of the box displayed on the
screen. This effects only the visible size of the box. It does not
restrict the amount of data that can be entered by the user.
Password Field if checked, this property will disguise the letters
entered by the user as asterisks
Tab Order - Complete this after all form elements have been entered and
placed in their final positions. This will allow users to "Tab through
the form" when filling it out. A number value is used starting with 1
for the first form element and proceeding with 2, 3, 4, etc. until all
form elements have been numbered. If this setting is left blank, the
browser will determine the tab order. Top |
Home
Form Properties Text Areas aka Scrolling Text
Boxes
Name - must follow the naming conventions described above
Value - The value of a scrolling text box is whatever the user types. If
the user fails to enter any information, an empty or null value is
returned.
Initial Value This optional field would make the box appear with text
already entered. The user could erase this text and enters their own.
This box is rarely if ever used. In most cases you will leave it blank.
Width in Characters dictates the visual width of the box displayed on
the screen. This does not restrict the amount of data that can be
entered by the user.
Number of Lines dictates how tall the box will appear on the screen.
This does not restrict the amount of data that can be entered by the
user. If a user enters more than will fit in the box, a scroll bar
will appear.
Tab Order - Complete this after all form elements have been entered and
placed in their final positions. This will allow users to "Tab through
the form" when filling it out. A number value is used starting with 1
for the first form element and proceeding with 2, 3, 4, etc. until all
form elements have been numbered. If this setting is left blank, the
browser will determine the tab order. Top |
Home
Form Properties Check Boxes
Name - must follow the naming conventions described above
Value The text characters and/or numbers entered here are the value
returned when a user checks the box and submits the form. If the box is
left unchecked, no value is returned.
Initial State The box can be set to be checked by default or can be
left unchecked. In most cases it is best to let the user make an active
choice so it is left unchecked.
Tab Order - Complete this after all form elements have been entered and
placed in their final positions. This will allow users to "Tab through
the form" when filling it out. A number value is used starting with 1
for the first form element and proceeding with 2, 3, 4, etc. until all
form elements have been numbered. If this setting is left blank, the
browser will determine the tab order. Top |
Home
Form Properties Option or Radio Buttons
Radio buttons exist in groups of 2 or more. These groups are defined by
the group name. All radio buttons belonging to one group must share
exactly the same name. This forces the user to select only one which is
the purpose of a radio button group.
Value The text characters and/or numbers entered here are the value
returned when the form is submitted. Change the default value to
something more meaningful.
Initial State Any button in a button group can appear selected by
default. Since only one selection can be made from a radio button group,
only one button from each group can be set this way. In most cases all
radio buttons should be set as non-selected.
Tab Order - Complete this after all form elements have been entered and
placed in their final positions. This will allow users to "Tab through
the form" when filling it out. A number value is used starting with 1
for the first form element and proceeding with 2, 3, 4, etc. until all
form elements have been numbered. If this setting is left blank, the
browser will determine the tab order. Top |
Home
Form Properties Drop Down Menus
Name - must follow the naming conventions described above.
Drop-down choices are added through the add button | Choices are then
added
The value submitted by default will be the text of the choice itself but
that can be changed by checking the "specify value" checkbox and typing
an alternate value in the box below it.
By default no item in the list of choices will be pre-selected.
Pre-selection is made by picking the selected option from the option
buttons at the bottom of the form. In most cases no choice will be
pre-selected forcing the user to make an active choice.
Height - set through the main properties box, dictates how tall the
box will appear on the screen. If the list of available choices is
longer than this height, a scroll bar will appear. Results of this
option are shown below. It is often used if you have allowed multiple
selections.
Allow Multiple Selections When checked, this property allows users to
select more than one value from the list by clicking the first choice,
holding the shift key, and picking the last choice (This will select the
two choices and all choices in-between) or by clicking the first choice,
holding the ctrl key, and clicking any other desired choices regardless
of position in the list.
Tab Order - Complete this after all form elements have been entered and
placed in their final positions. This will allow users to "Tab through
the form" when filling it out. A number value is used starting with 1
for the first form element and proceeding with 2, 3, 4, etc. until all
form elements have been numbered. If this setting is left blank, the
browser will determine the tab order. Deleting or
Changing the Order of Choices in a Drop-down menu is accomplished
through the buttons on the right side of the main properties window. The
"Move Up" and "Move Down" buttons are used to change order; the "Remove"
button to delete a choice; and the "Modify" button is used to modify the
choice text, a specified value or the selection status of a choice after
it has been entered.
 Top |
Home
Site Designed and Maintained by rsciorra
Last Updated
01/21/08
|
