Create a Form

This tutrial will show you how to create a form in Dreamweaver CS5.

In this section we're going to take our first look at forms in Dreamweaver.

We all seem to use forms on web sites nowadays for all sorts of reasons from online shopping to applying for a new job. We enter data onto the forms, then the data is stored in a database, or transmitted elsewhere and often emailed back to us to check.

Let's look at how we create a form in Dreamweaver.

Starting with a blank page, let's insert an empty form. Click the Insert menu then hover over Form. You see the Insert Form fly-out.

On this occasion we select Form and a dotted empty box appears.

Look at the Properties panel with the form selected.

First of all, let's give the form a name. For this exercise we'll make a form for capturing an order for flowers. We'll call the form FlowerForm1.

The Action box will specify the page or script that processes the data we enter into the form. We don't have that yet, so we'll leave it empty for the moment.

Now let's look at Method.

The method refers to the technique that the browser uses to send the form's data to the server. The GET method appends the data to the URL requesting the page. The POST method embeds the form data into the HTTP request. For now, we'll stick with the Default.

We don't need to worry about the other properties at the moment.

So, we now save the form with the name FlowerForm1.html using File Save As.

In general terms, the approach to creating forms is to first create the empty form and assign some of its properties, and then to insert the various fields onto the form. That's pretty much the approach we're using here.

However, it's very important to realize that a form should be carefully designed before starting to build it using Dreamweaver. Careless design and a lack of thought will probably mean that your form doesn't do the job, and probably won't get used. How often have you used a form online and been really frustrated and annoyed by how difficult it was to use?

Always start building a form with a clear layout to work from, and with all of the detail you are going to need about what each field on the form can contain, how to check interdependencies, etc.

More Dreamweaver CS5 Tutorials

All Dreamweaver CS5 Tutorials - Will be complete by Januay 2011.
Buy Dreamweaver CS5

Find this website useful?

To link to this page from your website, simply cut and paste the following code to your web page.

It will appear on your page as: Create a Form in Dreamweaver CS5

Share this Webpage

This site proudly build with Site Build It!