Assignment 3 Overview You will create JavaScript in ascript.js filethat handles the form on theorder.htmlpage (shown below). The Assignment 3 folder contains all files except the script.js file.You do...

Assignment 3

Overview

You will create JavaScript in ascript.js filethat handles the form on theorder.htmlpage (shown below). The Assignment 3 folder contains all files except the script.js file.You do not need to make changes to the index.html and style.css files other than to add a reference to the script.js file.

script.js File (2 Points)

Use the following specifications in your JavaScript file.

• 
  

  Put all variable definitions at the beginning of your file

  
  


• 
  

  Add a descriptive comment before each function definition

  
  


• 
  

  Put event listeners at the end of your file

  
  


• 
  

  No JavaScript in the html files

  
  

Total Cost Values (12 Points)

Create the necessary JavaScript to display the correct column totals. The totals should change when the quantities change. Note that these totals should revert to zero when the text inputs are blank or zero.

Tips:

• 
  

  You will need arrays for all the prices, quantities and total item costs. Consider querySelectorAll for this purpose. You will need to decide how to select all the elements. (Go back to the Udemy coverage.)

  
  


• 
  

  Once you declare the arrays, check the values for different array items after you change quantities. Before you write the function to calculate each total item cost, the total for each item will be zero.

  
  


• 
  

  You will need to listen for input of new quantities and call a function that updates the total item costs.

  
  


• 
  

  In the function to update the total item cost values, consider the following.oThink about the use of innerText. (Go back to the Udemy coverage).

  
  

oPerforming mathematical operations with items in the arrays will require conversion

from text.
oThink about the use of toFixed() to control the number of decimal places.

Fee Amount and Order Total (6 Points)

Pickup and Regular Delivery orders have no delivery charge. One day delivery is $10 extra. Create the necessary JavaScript to handle this condition and calculate the order total. Examples are below.

Tips:

• 
  

  You will need to define a function that changes the radio index variable value. You learned how to change the index value but did not put this into a function.

  
  


• 
  

  You will need to listen for changes in radio button selection like we defined in class and call the function that changes the radio index.

  
  


• 
  

  There will need to be a function that changes the delivery cost value and order total label.

  
  


• 
  

  Expand the function that changes the total item cost values to include a call to the function that changes the delivery cost value and order total label. You may want to change the name of this

  
  

  function if it is not descriptive enough.

  
  

  
  
  
  

  
  

  This is a intro class so nothing too advanced