Cześć,
mam problem ze zliczeniem ilości dodanych produktów do koszyka. Na wstępie pobieram 20 elementów przez pętlę i umieszczam je w DOM. Dla każdego elementu mam przycisk dodaj do koszyka, chciałbym aby po kliknięciu w jeden produkt wiele razy pojawiał się on w koszyku tylko raz i zliczana była ilość tych produktów. Niestety nie mam pomysłu jak mógłbym to zrobić. Myślałem o jakimś if, który sprawdzał by nazwę pizzy, ale chyba byłby za bardzo rozbudowany.
.then(data => {
let valueCurrency = 0;
data.forEach(element => {
const shoppingCart = document.querySelector(".shoppingCart");
const pizzas = document.querySelector(".pizzas");
const box = document.createElement("div");
const img = document.createElement("img");
const title = document.createElement("h3");
const ingredients = document.createElement("p");
const price = document.createElement("h4");
const btn = document.createElement("button");
const totalPrice = document.querySelector(".totalPrice");
box.className = "box";
ingredients.className = "ingredients"
btn.className = "btn";
img.src = element.image;
img.style.width = "250px";
img.style.height = "250px";
title.innerHTML = element.title;
ingredients.innerHTML = element.ingredients;
price.innerHTML = element.price.toFixed(2) + " zł";
btn.innerHTML = "Dodaj do koszyka";
box.appendChild(img);
box.appendChild(title);
box.appendChild(ingredients);
box.appendChild(price);
box.appendChild(btn);
pizzas.appendChild(box);
btn.addEventListener("click", (e) =>{
valueCurrency = valueCurrency + element.price;
console.log(valueCurrency);
const pizzasList = document.createElement("li");
const pizzaPrice = document.createElement("p");
const count = document.createElement("h5");
const btnRemove = document.createElement("button");
btnRemove.innerText = "X";
pizzaPrice.innerText = price.textContent;
totalPrice.innerText = "Całkowita cena: " + valueCurrency.toFixed(2);
pizzasList.innerText = title.textContent + " " + price.textContent;
console.log(price.textContent)
shoppingCart.prepend(pizzasList);
})
});
link do repo: https://github.com/ItsShock/internJavaScript
Proszę o rady i z góry dziękuję za pomoc.