Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Diane D
Diane D
800 Points

Why my JavaScript Shopping cart is not working correctly?

Hi! So I decided to challenge myself and create a webpage that has a table and a shopping cart using JavaScript, but after a month of playing around with my code, I can't seem to debug it anymore. I have placed my JavaScript code below for my array.js and cart.js files that I am using and any help on this matter is greatly appreciated!

arrays.js code

"use strict";  
var item = ["Hummus", "Lamb", "Cake"];
var price = ["$3.00", "$11.00", "$12.00"];
var qty = ["1", "1", "1"];
item[0] = "Hummus";
price[0] = "Lamb";
qty[0] = "1"

cart.js code

"use strict";  
var subtotal = 0;
var cartHTML= '<table><thead>'+ 
'<tr><th>Item Description</th><th>Price</th><th>Qty</th><th>Total</th></tr>'+ '</thead><tbody>'; 
for(var i=0; i< item.length; i++){
    cartHTML = cartHTML + "<tr><td>" + item[i] + "</td>";
    cartHTML = cartHTML + "<td>$" + price[i] + "</td>";
    cartHTML = "<td>"+ qty[i]+"</td>";
    var cost = price[i]*qty[i];
    cartHTML = cartHTML + "<td>$"+cost+"</td>";
    subtotal += cost;
}
var shipCost = Math.round(subtotal*0.05);
var orderTotal = subtotal + shipCost;
shipCost += ".00";

cartHTML += "</tbody><tfoot><tr><td colspan= '3'>Subtotal</td><td>$"+subtotal+"</td></tr>";
cartHTML += "<tr><td colspan='3'>Shipping*</td><td>$"+shipCost+"</td></tr>";
cartHTML += "<tr><td colspan= '3'>Total</td><td>$"+orderTotal+"</td></tr></tfoot></table>";
document.getElementById("cart").innerHTML=cartHTML;

var now = new Date();
var shipDays = now.getDate()+3;
now.setDate(shipDays);

document.getElementById("sdate").innerHTML = "*Orders placed today will be shipped by" + now.toLocaleDateString();

1 Answer

Hi, just to a quick glance, but you are targeting the ID "sdate" but have no elements with the ID of "sdate". It is not able to add this HTML because it can't find an element to add it to.