LEARN

STEPS:

1. Download TrendSetter.zip and unzip it

Open cart.html le in Notepad++.

For this hands on exercise, we’re going to compute for the total price of the items in the

cart.
2. Create a variable
Inside the function loadCart(), create a new variable that will store the total price of the items
in the cart.

Assign zero as its initial value.

PRINT
/

A variable is a name or identier that represents some data that you set. It can change its value
during the script.

To declare a variable in Javascript, you have to use the var keyword.

For example

var variableName;

Note: You can initialize the value of a variable upon declaring it.
3. Compute for the total price
For every run in the LOOP, add the prices of the item to variabletotal to get the total price of
the item. Price per item equates to the price of the items times the quantity.

Note: You can refer tocartRef.html for code guide.

PRINT
/

4. Display total price

After you are done computing for the nal price, you need to display it. After the line with the
code: code += "</table>", concatenate the string that will create the DIV element containing
the nal price.

(Check screenshot or refer tocartRef.html le for code guide)

Note: The method .toFixed()converts numbers to strings and limits the number of decimals.

Also, you must store the total price temporarily into the session storage. You can add it after
the code computing for the nal price.

PRINT
/

5. Run the website

Save the le by clicking on theSave icon or by pressing CTRL + S.

Now try to see if your codes are working properly by adding two different items in the cart. Go
to cart page afterwards. The page should have displayed the correct total price.

If everything is working ne, try to do your performance test.

 RUBRICS:

PRINT
/

EVALUATE
 OBJECTIVE TEST:

Book Total - Objective Test

PERFORMANCE TEST UPDATED:

Book Total - Performance Test 0

© 2021 | TechnoKids Philippines

PRINT
/