Scribd
Upload
5 views3 pages

Sample Product Data

The document contains JavaScript code for a simple shopping cart application. It allows users to view products, add them to a cart, and generate a bill. The code includes functions for displaying products, managing the cart, and calculating the total amount for the bill.

Uploaded by

nyakushlewis
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
5 views3 pages

Sample Product Data

The document contains JavaScript code for a simple shopping cart application. It allows users to view products, add them to a cart, and generate a bill. The code includes functions for displaying products, managing the cart, and calculating the total amount for the bill.

Uploaded by

nyakushlewis
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

// Sample product data

let products = [
{ id: 1, name: "Apple", price: 0.50, quantity: 100 },
{ id: 2, name: "Bread", price: 1.50, quantity: 50 },
{ id: 3, name: "Milk", price: 2.00, quantity: 30 }
];

// Cart to store selected products


let cart = [];

// Display products in the table


function displayProducts() {
const productTable =
document.getElementById("productTable").getElementsByTagName("tbody")[0];
productTable.innerHTML = "";

products.forEach(product => {
const row = productTable.insertRow();
row.insertCell(0).textContent = product.id;
row.insertCell(1).textContent = product.name;
row.insertCell(2).textContent = `$${product.price.toFixed(2)}`;
row.insertCell(3).textContent = product.quantity;

const actionCell = row.insertCell(4);


const input = document.createElement("input");
input.type = "number";
input.min = 1;
input.max = product.quantity;
input.value = 1;
input.style.width = "60px";

const button = document.createElement("button");


button.textContent = "Add to Bill";
button.onclick = () => addToCart(product.id, input.value);

actionCell.appendChild(input);
actionCell.appendChild(button);
});
}

// Add product to cart


function addToCart(productId, quantity) {
const product = products.find(p => p.id === productId);
if (product && product.quantity >= quantity) {
const cartItem = cart.find(item => item.id === productId);
if (cartItem) {
cartItem.quantity += parseInt(quantity);
} else {
cart.push({ ...product, quantity: parseInt(quantity) });
}
product.quantity -= parseInt(quantity);
displayCart();
displayProducts();
} else {
alert("Insufficient quantity or product not found!");
}
}

// Display cart items in the bill table


function displayCart() {
const billTable = document.getElementById("billTable").getElementsByTagName("tbody")[0];
billTable.innerHTML = "";

let totalAmount = 0;

cart.forEach(item => {
const row = billTable.insertRow();
row.insertCell(0).textContent = item.id;
row.insertCell(1).textContent = item.name;
row.insertCell(2).textContent = `$${item.price.toFixed(2)}`;
row.insertCell(3).textContent = item.quantity;
const total = item.price * item.quantity;
row.insertCell(4).textContent = `$${total.toFixed(2)}`;
totalAmount += total;
});

document.getElementById("totalAmount").textContent = totalAmount.toFixed(2);
}

// Generate bill (reset cart and update products)


function generateBill() {
if (cart.length === 0) {
alert("No items in the cart!");
return;
}
alert("Bill generated successfully!");
cart = [];
displayCart();
displayProducts();
}

// Initialize the page


window.onload = displayProducts;

You might also like