Start Basics Color Forms Frames Images Links Lists Tables Type

 

Forms: Dreamweaver 4
Create a Drop-Down Menu 

A drop-down menu allows a user to tab through a drop-down list to make a selection from a number of choices.
Example   What is your area code?      
To add a drop-down menu to your web page using Dreamweaver, you can choose Insert, Form Objects, List/Menu from the main menu.
Form Objects Dropdown Menu
You can also click on the Insert List/Menu button on the Forms Object Panel.

Insert List/Menu button
Insert List/Menu button

If you have not already created a form field to hold your form element, a dialog box will appear and you will be asked whether you want to add a form tag to your page.
Add Form Tag?
To function, menu must be placed within a form field.

Click on Yes.

Your menu will appear and be surrounded by a dotted red line. This dotted line delineates the form field.

Notice that when you insert a menu the Property Inspector displays the attributes of that form element.
Menu Property Inspector
In the List/Menu text box, specify a name that describes the list being provided in the menu box. (In the example above, the name might be areacode.)

By default Menu is the Type of form element being created.

To specify the contents of the menu, click on the List Values. . . button on the far right of the Property Inspector

The List Values dialog box appears

List Values dialog box

To add an item label, click on the plus sign on the top left of the dialog box and type in your value.
You should use the Value column to specify the value of  each menu item as it is to be sent through the form handler.

Example: I might want the data I collect from this form to specify a location rather than an area code. In this case I would specify the value for 703 as Northern Virginia.  

To specify a value for each item label, tab over to the Value column and enter a value (for example, a shorter or longer term). 

Item Labels with Values
Continue to click on the plus sign and add item labels and values until you have entered all of the items you wish to appear in your menu.
Note that you can use the minus sign to delete an item label

Note that once you have entered all the values you want to appear in your drop-down menu, you can use up and down arrows on the dialog box to rearrange the order of your choices.

When you have finished specifying choices for the drop-down menu, click on OK to return to your web page.
If you want to specify one of your item labels to appear in the menu, highlight that item in the Initially Selected box in the lower center of the Property Inspector.

Initially Selected

Forms: Dreamweaver 4
Overview
Create a Form
Create Text and Password Boxes
Create Radio Buttons
Create Check Boxes
Create a Drop-Down Menu
Create a Scrolling Text Box
Create the Reset and Submit Buttons

Start Basics Color Forms Frames Images Links Lists Tables Type

 

Personal Home PageWeb Design CenterTutorial MenuTop of Page

Web Design Center
Last Revised: September 2, 2001
© Agatha Taormina