* Dreamweaver

Inserting Forms

*Form
* A collection of input fields so users can obtain useful
information and enter data.

* Interactive elements that provide a way for the Web

site visitor to interact with the site.

* You cannot nest forms.

* Form Object-

* Can be a text box, check box radio button, list, menu, or

other button.

*Information
* What information can be collected?
* First Names
* Last Names
* User Names
* Addresses
* Phone numbers
* Comments

*Form Information
* Position your insertion point where you would like the
form on the page.

* DW will insert the <form> </form> tags into the source

code & display a dotted red line in the design view

* Forms cannot be resized by dragging red dotted line.

* Once a form is inserted, DW creates the JavaScript
needed to process the form.

*Inserting a Form
* From the Insert Menu

* Select the Form option

*Insert Options

* Or use the right file panel

* Or, if you have the Insert Bar displayed across
the top of the program

*Side Note
* Select the View Menu on the application bar
* Scroll to Visual Aids
* Ensure the Invisible Element option is checked
* In design view, form outlines are displayed as

dotted red outline. This is an invisible element

and will not be displayed in browser view.

* If you havent done so, select the form object

to insert into your page
* (Notice the red dotted line)

* Property Inspector changed

*Property Inspector
Info.

* Form ID Name the Form (remember to name everything)

* Action contains the mailto address or specifies the URL to the
dynamic page or script that will process the form.

* EX: mailto:killingsworth.Marlena.m@muscogee.k12.ga.us

* Target- Specifies the window or frame to which to display the

data after processing if a script specifies that a new page
should be displayed

* _self

* Method Indicates the method by which the form data is

transferred to the server. (Depends on the Server being used)

* POST, GET & Default

* If unsure of Server requirements select POST

*Property Inspector
Info.

* Enctype

- used for forms that collect private

data.
* Specifies a MIME (Multipurpose Internet Mail
Extensions)

* Allows the server to know how to interpret the

data submitted.

* Text/plain

* Class- Sets style sheet attributes and/ or

attaches a style sheet to the current
document.

*Inserting a Table in a
Form

* Assist in aligning Form objects

* Click inside the Form Object
* (red dotted line)
* Locate the Insert Menu or Insert Bar.or Insert
panel

* Insert a Table

*Table dialog box

This requires planning. You need to know what

information you want to collect

*Table Property
Inspector

* Name the table

* Align the table Center
* Note Form outline expanded to accommodate
table.

*Adjust table row

properties

* Select the first row

* Note the property inspector

*Insert Form objects

into Table

*Align insertion point in table and begin adding

Form Objects
Column of Input Information

First Name (Label)

Text Field

Last Name (Label)

Text Field

Gender

Male /Female radio buttons

Ethnicity

Check Boxes

*Table Sample

*Submit Information
* Insert a Form Button
* All forms should have a Submit & Reset Button
* Submit emails data
* Reset clears all form objects

* ALL FORM OBJECTS MUST BE INSIDE THE FORM

(RED DOTTED LINE).