Creating Reusable Assets and Forms - New Perspectives on Adobe Dreamweaver CS5, Comprehensive - page 382

17. In the lower-right cell, insert a Submit button, and then insert a second button.
18. Select the second button, click the Reset form option button in the Property inspec-
tor, type Reset in the Button name box, and then type Reset in the Value box, if
necessary.
19. Save the page, preview the page in a browser, test the form, and then close the
browser and the page.
20. Upload the site to your remote server, preview the site over the Internet, and then
test the form.
21. Submit the fi nished fi les to your instructor.

Case Problem 4

Create an online
order form for
a Web site for a
coffee lounge.

Data Files needed for this Case Problem: form_test.html

Coffee Lounge Tommy asks you to create an online order form for the home page of
the Coffee Lounge site. The coffee order form is designed to appeal to the business crowd
that frequents the lounge in the early morning and during lunch hours. The form will
enable customers to order coffee from their computer or Web-enabled phone and spec-
ify a pick-up time. Customers must be able to specify size, quantity, temperature (hot or
iced), and the drink fl avor. Customers can then walk in and grab their preordered coffee
with no wait at all. If the form generates enough business, Tommy will enable payment
processing in the future. Because the server-side script is still being fi nalized, you'll add
the form_test.html page to the site so you can test the form.

1. Open the Coffee Lounge site that you modifi ed in Tutorial 5.
2. Copy the form_test.html page located in the Tutorial.06\Case4 folder included with
your Data Files to the site's local root folder.
3. Open the index.html page in Design view, place the insertion point below the page
content, and then press the Enter key to add a new line.
4. Insert a form into the page, and then, in the Property inspector, change the form's
name to order , set the action to the form_test.html page in the site's local root folder,
set the target to _blank, change the method to GET, and then set the enctype to
application/x-www-form-urlencoded.
5. Type save time waiting in line, order your coffee in advance in the form area, apply
the h2 tag, and then press the Enter key.
6. Design your form. Use any form elements that you feel will effectively convey the
information to the user. Remember that the customer must be able to specify size,
quantity, temperature (hot or iced), and the drink fl avor. Add any other instructions
you think are necessary.
7. Insert a table inside the form to hold the form content.
8. Add form elements to the form.
9. Create a Submit button and a Reset button.
10. Create styles as needed for the form elements so they match the look and feel of the
site. Apply the styles to the elements where necessary.
11. Preview the page in Live View to see how it will look on the Web.
12. Save the page, and then preview the page in a browser.
13. Upload the site to your remote server, and then preview the pages over the Internet.
14. Submit the fi nished fi les to your instructor.