Adobe Dreamweaver CS3
Forms: Working with Lists/Menus
The List/Menu form field allows users to select an option or multiple options from a list of choices. The List option displays values in a scrolling list for which the size can be manually set; this allows a user to select multiple values at once. The Menu option displays values in a drop-down list; this allows a user to select only a single value.
To use a list or menu, both must be inserted into a form and assigned an item label and value. When users submit a form, their entries must go somewhere -- possibly to the designer via email or to a database or text file. Item labels and values are used to pass form field inputs to the script or form handler and then to the designer. This is done by matching the user's form field inputs to the form fields that requested them.
NOTE: For more information about working with optional form fields, please refer to Inserting the First Form Field, Opening the Form Field Properties Dialog Box, and Terminology.
Inserting a List/Menu
-
Place your cursor within the form boundary where you would like to insert the form field
NOTE: For more information on inserting forms, refer to Creating Forms. -
From the Insert menu, select Form » List/Menu
OR
From the Insert pane, in the Forms tab, click LIST/MENU
The Input Tag Accessibility Attributes dialog box appears.
-
In the Label text box, type an appropriate and descriptive label
NOTE: In the case of Lists and Menus, the Label is visible to the user and generally is the question the user needs to answer (e.g., State of residence.) -
Make any appropriate selection(s) under Style, Position, Access key, and Tab Index
-
Click OK
NOTE: If you are prompted to insert a form tag, click YES.
Assigning Item Labels, Values, and Names
When creating a list or menu, there are three elements which need to be set: the item label, value, and name. The field name identifies the question that the user is being asked, the item label represents the text that the user sees as an option, and the value is the option chosen by the user. For example, if the user is supposed to give their state of residence, the field name would be "State," the item label could be "Wisconsin," and the value would be "WI."
When a user submits the form, the inputs are sent to the owner of the form via email; the value of the drop-down box field will be matched with the name of the drop-down menu field. The information the owner receives may look like this:
name: value
EXAMPLE: state: WI
To assign the item label and value
-
Once the List/Menu has been inserted, select it
The List/Menu Properties pane appears at the bottom of the screen.
-
In the List/Menu text box, type a name for this field
EXAMPLE: State -
From the Type section, specify whether you want to create a List or a Menu
NOTE: A List allows more than one selection to be made while a Menu permits only one selection. -
From the List/Menu Properties pane, click LIST VALUES...
The List Values dialog box appears with a cursor under Item Label..
-
Under Item Label, type the appropriate text for the item
This text is what the user will see when selecting from your list. -
Press [Tab]
Your cursor switches over to the Value column.
-
Under Value, type the appropriate value
This text should identify the label it corresponds to. - To add additional items to your list:
- Click ADD
-
Repeat steps 4-6
- Click ADD
- To remove an item from your list
- Select the item
-
Click REMOVE
- To change the order in which an item appears
- Select the item
-
Click the appropriate arrow
-
When finished, click OK
-
OPTIONAL: In the List/Menu Properties pane, in the Selections section, specify whether you want to allow multiple selections by checking Allow multiple
NOTES:
This option is only applicable when you create a list.
The option is selected when a check mark appears in the box. -
OPTIONAL: In the Initially selected section, select the list item you want to appear selected by default
HINT: To avoid a pre-selected item, you may want to include an Item Label "Select" with the value "---".
