Building a Form


graphics/11inf01.jpg

Running the Form Page Wizard

graphics/11inf02.jpg

graphics/one_icon.jpg

Open the File menu and choose New to open the New task pane.

graphics/two_icon.jpg

In the New Page area of the New task pane, click the More Page templates link.

graphics/three_icon.jpg

The Page Templates dialog box opens. In the General tab, click the Form Page Wizard icon, and then click OK .

INTRODUCTION

You can add a form to any page (as you learn to do in the next task, "Starting a New Form from Scratch"), or you can create a new page that already has the form in it. A great way to do that is to run FrontPage's Form Page Wizard, which custom builds a form page based on answers you give to simple questions.


HINT

Some Templates Already Have Forms

You could also create a form page by using a page template that already has a form in it. Page templates that have their own forms include Guest Book, Feedback Form, and Confirmation Form; the Corporate Presence Wizard (see Part 9) also includes forms.


graphics/11inf03.jpg

graphics/four_icon.jpg

FrontPage launches the Form Page Wizard. Read the information in the first screen and click Next .

graphics/five_icon.jpg

Forms gather information from site visitors by asking the visitors certain questions. To begin selecting the questions that will appear on your form, click the Add button.

graphics/six_icon.jpg

Click an option in the Select the type of input to collect for this question list. A description of the selected option appears in the Description area.

TIP

Label Now or Later

When choosing each type of information to collect, you can change the prompt label that FrontPage will attach to the part of the form you selected by changing the text in the box at the bottom of the dialog box. You can also edit this label later, in your page.


graphics/11inf04.jpg

graphics/seven_icon.jpg

FrontPage suggests a way of wording the question. To change the wording, type over the suggested wording in the Edit the prompt for this question field.

graphics/eight_icon.jpg

Click Next .

graphics/nine_icon.jpg

Choose from any options presented (they vary depending on your selection in step 6), clicking Next to advance to the next screen.

graphics/ten_icon.jpg

Repeat steps 5 “9 for each question you want to add to your form.

TIP

Use the Wizard to Get in the Ballpark

You needn't get your form perfect with the wizard. After finishing the wizard, you can use the steps shown in the remainder of this chapter to add new fields to the form, delete fields, change labels ”make your form exactly what you want it to be.


TIP

Use Move Up and Move Down to Change the Order of Form Sections

After step 10, you can change the order of the questions in the form by using the Move Up and Move Down buttons to change the order of the list.


graphics/11inf05.jpg

graphics/eleven_icon.jpg

When you finish adding questions to your form, click Next to choose general form options.

graphics/twelve_icon.jpg

When the wizard reports that it has no more questions to ask you, click the Finish button.

graphics/thirteen_icon.jpg

FrontPage creates a page with a form containing the questions you added.

INTRODUCTION

The remaining steps help you arrange and format the questions you've selected into a form that's right for your site, and ”more importantly ”help you decide what FrontPage should do with the information it collects from your visitors.


TIP

Play Around with Wizards

This task demonstrates only one of the many different types of forms you can create by making different choices in the Form Page Wizard. Feel free to experiment. If you don't like the results, it's easy to start over.


Starting a New Form from Scratch

graphics/11inf06.jpg

graphics/one_icon.jpg

In Design view, click in your page where you want the form to appear.

graphics/two_icon.jpg

Open the Insert menu, choose Form , and select Form .

graphics/three_icon.jpg

A form containing Submit and Reset buttons is placed on the page.

INTRODUCTION

The first step in building a FrontPage form from scratch is creating an invisible box in your page to hold all the form fields. The box includes two buttons essential to any form ”a Submit button to submit the form data and a Reset button for clearing the form and starting over. The box also enables you to reposition the form without moving the fields one by one.


HINT

Form Boxes Expand to Meet Your Needs

Don't worry about the size of the form box. It will expand automatically to hold whatever fields you put in it (covered in the next several tasks ).


Adding Form Fields

graphics/11inf07.jpg

graphics/one_icon.jpg

Click just to the left of the Submit button to place the insertion point there.

graphics/two_icon.jpg

Open the Insert menu, choose Form , and select any of the field types shown (here, Textbox is selected). The field is inserted.

graphics/three_icon.jpg

To insert a second field to the right of the first, repeat step 2. To insert a new field beneath the first, press Enter to start a new line, and then repeat step 2.

INTRODUCTION

After you've inserted an empty form with Submit and Reset buttons on a page, you can begin adding the form fields ”that is, the text boxes, lists, and other fields a visitor uses to enter information or select options. Each type of field features different options, but inserting basic fields is pretty much the same all around.


HINT

Fields Can Go Anywhere

You can insert your fields above, below, or even beside the Submit and Reset buttons, but most page authors place those buttons at the very bottom of the form.


HINT

Choose Field Types Carefully

If you want a short typed response, use a one-line text box field; use a text area field for longer responses. Option buttons and check boxes let visitors choose one or more options shown.


Labeling Form Fields

graphics/11inf08.jpg

graphics/one_icon.jpg

Click next to the field to which you want to add a label to place the insertion point there.

graphics/two_icon.jpg

Type the label text.

graphics/three_icon.jpg

To connect the label to its associated field, click and drag to select both the label and its field.

graphics/four_icon.jpg

Open the Insert menu, choose Form , and select Label .

INTRODUCTION

Of course, each form field needs an onscreen name or label so that the visitor will know what type of data to enter in it. After you create a label, you will associate it to the field it represents.


HINT

Labels Can Take Text Formatting

After you create the label, you can select it and apply to it any character formatting (font, bold, and so on) you want.


HINT

Put Your Labels Anywhere You Want

You can place the label anywhere you want in relation to the field (above, to the left, to the right, or below), as long as no other label or field comes between a label and its associated field.


Adding Options to a Drop-Down Box

graphics/11inf09.jpg

graphics/one_icon.jpg

In your form, double-click the drop-down box field.

graphics/two_icon.jpg

The Drop-Down Box Properties dialog box opens. To add the first option, click the Add button.

graphics/three_icon.jpg

The Add Choice dialog box opens. In the Choice field, type the item text.

graphics/four_icon.jpg

Click OK .

INTRODUCTION

Drop-down boxes are different from most other fields in that they contain a list of options from which the site visitor can select. That means you must populate each list box you create with your own set of options.


TIP

You Can Allow Your Visitors to Make Multiple Selections in a List

In the Drop-Down Properties dialog box, note that you can click the Yes option button in the Allow multiple selections area to permit visitors to make multiple selections from one list. Using that option might confuse visitors accustomed to lists that permit one choice only. When you want to allow multiple selections, it's better to show option buttons or check boxes.


graphics/11inf10.jpg

graphics/five_icon.jpg

Repeat steps 2 “4 to add more options to the drop-down box.

graphics/six_icon.jpg

When you finish adding options to the drop-down box, click OK .

graphics/seven_icon.jpg

Click the drop-down box's down arrow to display the options you entered.

TIP

Rearranging List Items

You can rearrange the order of items in the list by using the Drop-Down Box Properties dialog box. To do so, click an item whose place in the order you want to change, and then click the Move Up or Move Down button.


Choosing an Initial Value for a Field

graphics/11inf11.jpg

graphics/one_icon.jpg

Double-click the field for which you want to choose an initial value. The field's Properties dialog box opens. (In this example, it's the Check Box Properties dialog box.)

graphics/two_icon.jpg

In the Initial value field or the Initial state field (depending on the field type), type or select the initial value or state.

graphics/three_icon.jpg

Click OK .

graphics/four_icon.jpg

The field on the form is updated to contain the initial value or state you specified.

INTRODUCTION

An initial value or initial state is an optional default form entry you offer your visitors to save them time. For example, if you predict that most visitors will probably choose a particular check box or menu item, you can make that option appear to be preselected on the form. If the visitor disagrees, she can always change that entry.


TIP

Setting an Initial Value for a Drop-Down List

To set the initial value for a drop-down box, double-click the field on the form. Double-click an option to open the Modify Choice dialog box; then, in the Initial state area, click the Selected option.


HINT

Leave Some Fields Alone, at First

Most other fields you see in the Properties dialog boxes ”such as Name and Value ”are related to processing the form data. It's best to leave these fields alone, or to change them only in consultation with an expert.


Changing the Size and Shape of Fields

graphics/11inf12.jpg

graphics/one_icon.jpg

Click the field you want to modify to select it.

graphics/two_icon.jpg

Click one of the sizing handles that appear around the field and drag to change the field's size or shape, just as you would a picture.

graphics/three_icon.jpg

Click anywhere outside the field to deselect it.

INTRODUCTION

As a rule, treat form fields like pictures trapped within the form box. You can drag a field or label above, below, or beside other objects, and you can use the alignment and indent buttons on the formatting toolbar to align or indent fields and labels within the form box. Beyond that, there are a few other tweaks you can use.


TIP

Use Handles to Resize Text Boxes

For a scrolling text box, you can drag the top, bottom, side, or corner handles to change the size and/or shape of the box. You can change the width of a one-line text box, but not its height; conversely, you can change a menu's height, but not its width. Option buttons and check boxes cannot be resized or reshaped.


Choosing How a Form Is to Be Processed

graphics/11inf13.jpg

graphics/one_icon.jpg

Click anywhere in the form. Then, open the Insert menu, choose Form , and select Form Properties . The Form Properties dialog box opens.

graphics/two_icon.jpg

If your server uses FrontPage Extensions, click Send to and, in the File name field, specify the name and location of the file where data received from visitors will be stored.

graphics/three_icon.jpg

If the server does not have FrontPage Extensions, click Send to other , and consult with the system administrator about having a script written.

graphics/four_icon.jpg

Click OK .

INTRODUCTION

You must work closely with your Internet service provider or the administrator of the server where you will publish your pages to set up form processing. Before you begin, it is imperative that you contact your server administrator and ask whether the server on which your form will be published has FrontPage Extensions installed.


TIP

Locating the File

If you don't know the exact location of the file where form data will be stored, click the Browse button next to the File name field in step 3 to locate the file.


TIP

You Can Send Data As an Email Message

When the server has FrontPage Extensions, you can optionally enter an email address in step 2. All form responses will be sent automatically to that address as email messages.




Easy Microsoft Office FrontPage 2003
Easy Microsoft Office FrontPage 2003
ISBN: 078972961X
EAN: 2147483647
Year: 2003
Pages: 74
Authors: Ned Snell

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net