Scribd
Upload
471 views

Forms

Dreamweaver allows users to easily insert forms to collect information from website visitors. Forms contain interactive elements like text boxes, checkboxes, and buttons. Information that can be collected includes names, addresses, phone numbers, and comments. When inserting a form, Dreamweaver automatically adds the necessary code and displays a red dotted outline. Tables can be inserted inside forms to help align the form elements. Common form objects include text fields, radio buttons, checkboxes and buttons to submit or reset the form.

Uploaded by

api-264479275
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
471 views

Forms

Dreamweaver allows users to easily insert forms to collect information from website visitors. Forms contain interactive elements like text boxes, checkboxes, and buttons. Information that can be collected includes names, addresses, phone numbers, and comments. When inserting a form, Dreamweaver automatically adds the necessary code and displays a red dotted outline. Tables can be inserted inside forms to help align the form elements. Common form objects include text fields, radio buttons, checkboxes and buttons to submit or reset the form.

Uploaded by

api-264479275
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 17

* 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:[email protected]

* 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).

You might also like