Tennessee State University
Faculty Web Area
Newbie Help |
Home > Web Page Form using Microsoft FrontPage: Sending Data to Email
Problem Description: In this example we will create an e-commerce
page that allows visitors to submit a purchase order to a fictional company
for widgets. We do not have the capability to submit credit card orders to a
payment gateway, but we can take orders and email to the service center for
processing. All of the necessary information to building the form has been
supplied by the marketing department.
Our page will need the following elements:
* Page with Company Logo
* Form with:
-Product Names
-Images of the Products
-Product Prices
-Product Descriptions
Click the image to the left to view our completed form.
Building the form:
1. It is best to plan your form on paper
before moving to the web. Plan to display your form in a tabular format. The
borders of your tables can be made invisible.
2. All of these items will be contained in a form. The form should be
created first.
To create a form:
a. Go to the menu Insert | Form > Form.
b. You should see a dotted box in your Normal window area. It will contain a
submit and reset button for you.
3. It is often easiest to start with the table being built first, then move
to the elements that will contain it. The table will be created inside the
form dotted box above the submit and reset buttons.
To create a table that will resemble the visual above:
a. Go to the menu Table | Insert > Table.
b. From the Insert Table Dialog box you can select how many rows and columns
you want. In the image you can see that the first table, from the two you
can see, has two rows and two columns. The border is set to 1. The option
show both cells and table borders is selected.
c. Click ok. You should see this:
4. At this point you can enter text and form items into the table:
| Ocean Widget |
Price: $52.50 each |
| [Picture Here] |
Quantity Desired:
Introducing the Ocean Widget, our most popular product. Customers cannot
express how happy they are with their Ocean Widget. Be sure to have a
large stock! |
a. To add the checkbox: Put the mouse cursor
right next to the ocean widget text and click there to designate it as the place
where the checkbox will go. Then select Insert | Form > Checkbox.
b. To add the textbox: Put the mouse cursor right next to the Quantity Desired
text and click there to designate it as the place where the textbox will go.
Then select Insert | Form > textbox.
c. You should assign a name and value for each form item. Right click the
checkbox and textbox to select the Form Field Properties menu item. Type in a
name without spaces. The name should be easy for you to understand, but not too
long.
5. Repeat the actions from steps 3-4 to complete the form. Make sure all
your form elements are inside the dotted box of the form.
6. Now you are ready to configure your form to send the data to a
particular destination.
7. To view the configuration for the form, right click anywhere within
the dotted box. The popup menu will have a Form Properties option, select it.
You will see a view similar to the image below.
Form Properties Dialog Box
8. You have several optional where you can send the form data. One of
them is to a particular email address. Put the email address where you want the
form data sent in the Email address box.
9. Press the Options button in the Form Properties to see the Saving
Results Dialog Box below.
Saving Results Dialog Box
10. In the Saving Results area you enter how you want your form
processed. The important sections are subject line and reply-to line. The
subject line will show what will be in the subject area of the email you send.
If the user where the email is being decides to reply to email the address given
in the reply-to box will be listed.
11. Your form data is automatically setup in the Saved Fields tab (see
image below). If you want to include or exclude data select the appropriate
fields.
Saved Results Dialog Box, Saved Fields Tab
12. At this point you can add additional items to your email like the
remote computer's name, browser type, and username. The submission date and time
can be setup in a particular format.
13. If you would like the user to see a confirmation page that does not
look like the generic one generated by FrontPage extensions, select the
confirmation page tab and select the name of a page you create to send them to.
This is ideal so that customers know their information has been processed.
Your form is done! Now you should save your work
and test it to make sure the data is sent to you. Feel free to copy the
tutorial file and setup the form
without making the tables.
Tennessee State University
3500 John A. Merritt Blvd., Nashville, Tennessee 37209
Phone (615) 963-5000
© Copyright 2002, Tennessee State University, All Rights Reserved.
Tennessee State University is an AA/EOE Institution