Assignment 7
Add a new page to your existing website. Use
Bootstrap styling. You have total freedom over the page format and content.
Required Knowledge & Skills
- SublimeText 3 (Optional)
- Bootstrap
- JavaScript
- HTML Forms
Assignment Instructions
Create a new page alongside the web pages created before. You do not need to modify any of the previous webpages. You may want to refer to the Bootstrap website for examples. Note: For this assignment, all CSS styles will be in the external CSS file unless specified otherwise.
- The title of the page should be "Assignment 7 - [Username]" (5 points)
- Create an HTML form to sell a product (you can choose any sort of product based on the theme of your
website). The form should contain the following inputs (30 points):
- [type=text]: Full name
- [type=text]: Quantity
- Submit Button
- Create a JavaScript function that is called when the user clicks on the submit button. It must do
the following (45 points):
- Check if the value entered for quantity is valid. It should be a number between 1 and 10.
- Calculate the total cost by and multiplying the quantity from the input field by a fixed price.
- Give a discount based on the quantity ordered, 10% for a quantity greater than 3, and 15% for a quantity greater than 5.
- The total price calculated should be at the bottom of the form. An error message should be displayed instead if the quantity entered isn't valid.
- Upload any pages created/modified to AwardSpace and a link to it should be attached as a submission comment. All pages must be linked to each other in the nav bar. All links must be working as expected. (10 points)
- Website aesthetics. (Use Bootstrap forms) (10 points)
- Follow the best practices for JavaScript (Ref: https://www.w3schools.com/js/js_best_practices.asp) (10 points bonus)
- Appropriate indentation, layout, syntax must be followed for HTML/CSS/Bootstrap. (10 points penalty)
Submission - Upload any pages created/modified to AwardSpace. Add all your files (HTML/CSS/media files, etc.) to a folder and compress it. Submit your zipped file along with the URL of the web page of your Assignment 7 on AwardSpace to Canvas. The URL should be submitted as a submission comment with your zip file. Please test all the links within your website before submission.