beautypg.com

Create an html form – Adobe Dreamweaver CC 2014 v.13 User Manual

Page 592

background image

To the top

next visits the site.

Buttons Perform actions when clicked. You can add a custom name or label for a button, or use one of the predefined “Submit” or “Reset” labels.
Use a button to submit form data to the server or to reset the form. You can also assign other processing tasks that you define in a script. For
example, the button might calculate the total cost of items selected based on assigned values.

Check boxes Allow multiple responses within a single group of options. A user can select as many options as apply. The following example
shows three check box items selected: Surfing, Mountain Biking, and Rafting.

Radio buttons Represent exclusive choices. Selecting a button within a radio button group deselects all others in the group (a group consists of
two or more buttons that share the same name). In the example below, Rafting is the currently selected option. If the user clicks Surfing, the
Rafting button is automatically cleared.

List menus Display option values within a scrolling list that allows users to select multiple options. The List option displays the option values in a
menu that allows users to select only a single item. Use menus when you have a limited amount of space, but must display many items, or to
control the values returned to the server. Unlike text fields where users can type anything they want, including invalid data, you set the exact
values returned by a menu.
Note: A pop-up menu on an HTML form is not the same as a graphical pop-up menu. For information on creating, editing, and showing and
hiding a graphical pop-up menu, see the link at the end of this section.

Jump menus Navigational lists or pop-up menus that let you insert a menu in which each option links to a document or file.

File fields Let users browse to a file on their computer and upload the file as form data.

Image fields Let you insert an image in a form. Use image fields to make graphical buttons such as Submit or Reset buttons. Using an image to
perform tasks other than submitting data requires attaching a behavior to the form object.

Create an HTML form

(Creative Cloud users only): As part of HTML5 support, new attributes have been introduced in the Properties panel for form elements. In addition,
four new form elements (E-mail, search, telephone, URL) have been introduced in the Forms section of the Insert panel. For more information, see

Enhanced HTML5 support for form elements

.

1. Open a page and place the insertion point where you want the form to appear.

2. Select Insert > Form, or select the Forms category in the Insert panel and click the Form icon.

In Design view, forms are indicated by a dotted red outline. If you don’t see this outline, select View > Visual Aids > Invisible Elements.

3. Set the properties of the HTML form in the Property inspector (Window >Properties):

a. In the Document window, click the form outline to select the form.

b. In the Form Name box, type a unique name to identify the form.

Naming a form makes it possible to reference or control the form with a scripting language, such as JavaScript or VBScript. If you do not
name the form, Dreamweaver generates a name using the syntax formn, and increments the value of n for each form added to the
page.

585

This manual is related to the following products: