+1 (315) 557-6473 

Html Program to Create a Pizza Order Website Layout Assignment Solution.


Write a HTML assignment to create a pizza order website layout.

Requirements and Specifications

Drexel University
College of Computing and Informatics
INFO 532 – Software Development
Week 7: Programming Assignment 7
Due Date: Sunday, Nov. 7, 2021
This assignment has 1 question. For each file submitted, you must indicate your name and student number in a header. An example header is shown as follows:
Student Name:
Solution for Assignment 7
For submitting this assignment, you need to put all your individual HTML files in a single ZIP file called a7-submission-FirstName-LastName.zip and submit the zipped file through the Blackboard system. You must submit your HTML with JavaScript code in a zipped file. If you submit individual files through the Blackboard system, the system will modify the JavaScript tags and disable them.
Figure 1: Pizza Order Form
Question. In this question, you are asked to create a pizza order form as shown in Figure 1. This assignment combines the forms in the programming assignment 5 and assignment 6.
  • Create a new HTML document in your text editor. Name your document as a7-FirstName-LastName.html.
  • Create element, header information, and the element in the HTML document.
  • Use “Pizza Order Form” as the title and heading of the document.
  • Add a form section in the document body.
  • Add other form fields as shown in Figure 1: Note: there are 3 textboxes for Name, Address, and Phone.
  • Add a script section in the head.
  • Implement the following functionality for the “Submit Order” button:
When the “Submit Order” button is clicked,
  1. Firstly, check whether there are values in the Name, Address, and Phone textboxes, whether a size radio button is selected, and whether at least one toppings are selected. If any value is missing, alert the user. Note: the alert message must be specific. That is, it must notify user which value is missing. For example, if the Phone textbox is empty, alert the user with a message such as “Phone is required.”
  2. Secondly, check whether the phone number is in the correct format. This time, a correct format is either a string of exact 10 digits or a string of ddd-ddd-dddd. If the phone number is not in a correct format, alert the user.
  3. Finally, if above checks passed, print out the order information as follows:
Name: John Smith
Address: 3675 Market Street
Phone: 215-895-2500
Size: Small
Toppings: Bacon, Sausage
  • Implement the following functionality for the “Clear Entries” button:
  • When the “Clear Entries” button is clicked, all the text fields should be empty; no radio button and check box should be selected.
If you need further clarifications about the requirements, please ask your instructor.
  1. How to Hand In:
    1. Please name your individual files as indicated in the questions.
    2. Please place all your individual files in a single ZIP file named as a7-submission-FirstName-LastName.zip and submit the zipped file.
    3. Submit the a7-submission-FirstName-LastName.zip through the course website in the Blackboard system.
  2. When to Hand In:
  3. Submit your assignment no later than 11:59pm in the due date.

  4. Marking Schemes:
Marking assignments will be based on several aspects: correctness, presentation, and coding styles.
  1. For programming questions, 10% of the mark will be judged on the coding style.
The following is an adaptation of the coding style of Java programming to this course:
  • Write a good comment for each variable, each method, each control branch, and each loop.
  • Use appropriate indentations to indicate control flows and blocks of code. For example,
function func(){
 if (expression 1){
  do some thing;
 else {
  do some thing else;
  • Your method comments must mention the purpose of each parameter, and must be grammatically correct.
  • Each line must be less than 80 characters long including tabs and spaces. Beware of "soft returns" -- some word processors, like WordPad, wrap lines automatically. If you use such a program, make sure that you press the return key yourself.
  • Put a blank space before and after every operator. For example, the first line below is good but the second line is not:
            boolean b = 3 > x && 4 - 5 < 32;
     boolean b = 3>x && 4-5<32;
  • When breaking up a long line, break it before an operator, not after. The first example below is good but the second is not:
          boolean b = "Hello".charAt(3) + 3 > x
            && Integer.parseInt(s) < 32;
    boolean b = "Hello".charAt(3) + 3 > x &&
            Integer.parseInt(s) < 32;
  • Always use braces on if, else, and loop blocks. The first example below is good but the second is not:
    if (x > 5) {
      while (i > 3) {
        // Do something
    } else {
      // Do something else
    if (x > 5)
      while (i > 3)
        // Do something
                  // Do something

Source Code

================================================ Student Name: Solution for Assignment 7 ================================================ < !DOCTYPE html > < html > < head > < title >Pizza Order Form< /title > < body > < div id="customer_info" > < h2 >Step 1: Customer Information:< /h2 > < label for="customer_name" >Name:< /label > < input type="text" id="customer_name" >< br > < label for="customer_address" >Address:< /label > < input type="text" id="customer_address" >< br > < label for="customer_phone" >Phone:< /label > < input type="text" id="customer_phone" >< br > < /div > < div id="pizza_size" > < h2 >Step 2: Select the size of the pizza you want:< /h2 > < input type="radio" name="pizza_size" id="rb_size_small" value="small" > < label for="rb_size_small" >Small< /label > < input type="radio" name="pizza_size" id="rb_size_medium" value="medium" > < label for="rb_size_medium" >Medium< /label > < input type="radio" name="pizza_size" id="rb_size_large" value="large" > < label for="rb_size_large" >Large< /label > < /div > < div id="pizza_toppings" > < h2 >Step 3: Select the pizza toppings you want:< /h2 > < input type="checkbox" id="cb_topping_pepperoni" > < label for="cb_topping_pepperoni" >Pepperoni< /label > < input type="checkbox" id="cb_topping_bacon" > < label for="cb_topping_bacon" >Bacon< /label > < input type="checkbox" id="cb_topping_sausage" > < label for="cb_topping_sausage" >Sausage< /label > < input type="checkbox" id="cb_topping_mushrooms" > < label for="cb_topping_mushrooms" >Mushrooms< /label > < /div > < div id="buttons" style="padding-top:20px" > < button id="Submit" onclick="submitOrder()" >Submit Order< /button > < button id="Clear" onclick="clearEntries()" >Clear Entries< /button > < /div > < div id="result" style="padding-top:20px" > < h3 >< label id="result_text" >< /label >< /h3 > < /div > < script > function submitOrder() { // Your validation and order submission logic here... } function clearEntries() { // Your code to clear form entries here... } < /script > < /body > < /html >