How to Create a Form in Dreamweaver - dummies

By David Karlins, Doug Sahlin

Dreamweaver doesn’t make building a basic form much easier than coding it directly in HTML. It’s not like typing <form takes a lot longer than choosing Insert→Form→Form. The real value of Dreamweaver lies in seamlessly generating JavaScript for validation scripts and jQuery Mobile form elements. To make those scripts work, though, you need to set up a form correctly in Dreamweaver.

Here comes the obligatory warning that precedes every discussion of how to do anything in Dreamweaver: Stop. If you’re not working in a defined Dreamweaver site — as defined in the Site Definition dialog box — none of this will work.

With a site defined, and an HTML page saved in Dreamweaver, following these steps will create a form:

1Click in your document to set your cursor at the insertion point in an HTML document where the form will appear and choose Insert→Form→Form.

If you’re in Code view, the Tag Editor – Form dialog box appears; click OK to make it disappear because you don’t need it.

Embedding a form in Dreamweaver.

2Click OK to embed the form.

The form appears in Design view in a red box. With the red box selected, the Properties Inspector displays settings for the form.

3In the Action field of the Properties Inspector, enter an action.

This could be a link to a PHP script or an e-mail action.

The Action field of the Properties Inspector

4If you’re sending form content by e-mail, enter text/html in the Enctype field.

Red lines in Design view define the beginning and end of the form element, and <form> and </form> tags in Code view do the same thing. Stay inside the form element when adding all form elements!