Step 1

Open FrontPage 2003, then open your site.

٭See Opening Your Web Site for more information about opening your site.

Step 2

Locate the form template for your site, right click on it, and choose New From Existing Page.  A new page is created based on the template and includes all of the page formatting needed.

You will notice that there is a form with pre-set fields already inserted on your page.  You may use these fields and modify the properties, or delete and create your own. (٭See step 4 for further instructions on how to create your own)

٭See Creating Web Pages From Templates for more information about using templates.

Step 3

Save the new page in the root folder of your site. Be sure to keep the file extension as ".htm" --do not change it to .shtml" or the form will not work.

Step 4 - Adding new fields to your form:

(To modify the existing fields, see step 5.)

*Please Note: Adding new fields to the form template may require training beyond the scope of this tutorial.  For assistance with this procedure, please e-mail the web manager.

Select Insert on the menu bar, click Form, and choose one of the following:
Textbox
Text Area
File Upload
Check Box
Option Button
Drop Down Box
Push Button
Group Box

For more information about the above form fields, see " About Form Fields"

Step 5

Right click on the form field you wish to modify and choose Form Field Properties....

Note: If you are modifying a Group Box, you will choose Group Box Properties

Step 6

When the Text Box Properties pop-up box appears, modify or add properties in the appropriate fields.

Please Note: Empty spaces are not allowed in these fields.  You must use an underscore, "_" instead of spaces.

Also Note: Be sure to set the Tab order of your form fields so that the your users can use their tab key to move through the form.  This is particularly important to users who have difficulty seeing the screen.  For more information about accessibility laws, see Web Development Resources, Accessibility.  (i.e. If you have three fields:  First Name, Last Name, and e-mail address, you would set the tab order for the first name field as 1, the last name as 2, and the e-mail address as 3.)

The Initial value: field would only be filled-in if you wanted something to be visible in the field.

The Validate... button is explained in Step 10.

Step 7

Select the Private Folder from the folder list  task pane and click on the Create New Page button.

Rename the page and change the extension to .csv

Note: Anytime you make a major change to your form, such as adding or deleting a form field, it is a best practice to create a new .csv file (i.e. test.csv → test2.csv)  Not doing this can cause the form to malfunction.

Step 8

Right click anywhere in the form and choose Form Properties.

Step 9

Make sure that the Send to radio button is selected under Where to store results, then click Browse... and navigate to the .csv file that you created in step 8.

In the E-mail address field, enter your own e-mail address while testing the form. After the form has been reviewed and tested, and before the form is published, change the Send to field to the e-mail address of the person in charge of processing the form results.

(It is not possible to e-mail the results to more than one e-mail account without undertaking a somewhat complicated procedure which is beyond the scope of this tutorial.  If you require the results to be sent to multiple parties, please contact the web manager for additional training.)

Under Form properties > Form name: enter the name of your form using underscores instead of spaces.

Click the OK button

Reminder:  If you have to change the filename of the .csv file, make sure to update the filename in the Send to field of the Form Properties.

Step 10 - Apply Validation

In some fields you will want to make sure that the user enters valid data, or you may want to require that certain fields be filled-out.  This process is called validation.

٭ Note: It is strongly suggested that you use validation in at least one of the form fields.  This helps prevent spammers from automatically filling out your form and generating un-needed results.  Be sure to use validation in the most important fields (i.e. name, phone number, or CCRI ID) but not necessarily on all fields.  Sometimes when too much information is required users are deterred from completing the form.

٭ See Form Validation for more information.

Example: Completed Form

Below is an example of a completed form. Notice the instruction box located below the form fields.  It's a good idea to use supplemental instructions similar to these when requiring specific information, such as the CCRI ID#, for which the definition may not be universally understood.