1. Create an HTML file and give it all of the necessary basic tags.
3. Give the page a heading of “[Your Business Name] – eCommerce”.
5. Have a table with three columns with headings: Product/Service Name, Price and Discount.
6. Include at least 4 products or services in this table, each on its own row. Each product’s or service’s information should appear on its own row in the table.
7. The Discount is going to be the percentage that your business will take off of the total purchase price for a given product. This will be some number between 1% and 50%. However, you will display the Discount as a decimal. This means that you would use a number equal to the Discount divided by 100. eg 10% discount will be written in the HTML table as 0.10, an 8% discount would be written as .08.
1. Note: this will make your job easier when you need to do calculations in your code
9. Have a prompt box to ask the customer for their name. Your prompt should have the message “Welcome to [Your Business Name]. Please enter your name”. Save the customer’s name in a variable. Use your business’ name, where appropriate.
10. Next have a welcome message using an alert box. For example: “Hello [customer name here]. Please look through our available products and services before placing your order.”
11. Have two prompt boxes to take as input the name of the product/service the customer wants from the table and the quantity they want to purchase.
12. Have a confirm statement verifying the placed order. For example your Confirm box should show the message:
Jim you ordered 2 of Ice Cream Cone. Is this correct?
13. If the user clicks on CANCEL, the program stops and a message is displayed saying:
Refresh the page to reload and place a new order.
1. Hint: This will most likely occur in an else branch
14. If the user clicks OK, proceed to calculating the cost of purchase.
15. Use the if-else structure to determine what the price and discount of the product is based on the product name entered by the user.
1. Note: Assume the product name will be entered in as all lower-case characters.
2. Hint: You will have an if-else condition for each possible product/service; the statements that run for each of these conditions will set the discount and price.
16. If a user enters a product name that does not match the choices displayed in the table, display the following message before quitting from the program.
1. Hint: This can be done in the final else part of the if- else structure that looks up the product price and discount.
Sorry, Jim. You entered an invalid product. Refresh the page to reload and place the order again.
17. Based on these inputs calculate the cost of the purchase using the formula:
cost_of_order = price_of_product * quantity_required
discount = price_of_product * item_discount * quantity_required
18. Finally have an output using the document.write. The format should be as follows:
(The bold face words below represent either user-supplied inputs stored in variables or the result of calculation )
Thank you for placing an order with us, Jim.
The cost of buying 2 of Ice Cream Cone is $5.32.
The discount for this purchase is $ .53
With discount, your total order cost is $4.79.
1. Note: If you do not have a valid product name, make sure this last item does not print. You can do this by having an if-structure around this output that runs only if a valid product name has been entered.
(Note: Each output sentence needs to be printed on a separate line.)