• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Zliczenie odpowiedniej liczby kliknięć dla danego elemenu

+1 głos
62 wizyt
pytanie zadane 4 dni temu w JavaScript przez ShockWave Bywalec (2,210 p.)

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.

1 odpowiedź

+1 głos
odpowiedź 3 dni temu przez Marchiew Dyskutant (7,600 p.)
wybrane 3 dni temu przez ShockWave
 
Najlepsza
Możesz mieć tablicę z koszykiem zakupowym i do niej wrzucać kliknięte produkty i na nim robić co chcesz.
komentarz 3 dni temu przez ShockWave Bywalec (2,210 p.)
I jeśli pojawią się dwie takie same wartości to się z duplikują? Czy to kwestia wyciągnięcia z niej danych?
komentarz 3 dni temu przez Wiciorny Mędrzec (184,570 p.)
no ale to od Ciebie zależy w jaki sposób implementujesz strukturę obiektu, tak aby w swoim zbiorze był on rozróżnialny na tle innych tej samej kategorii
komentarz 3 dni temu przez Marchiew Dyskutant (7,600 p.)

@ShockWave, Twoje produkty mają id, więc możesz do koszyka wrzucać tylko id (lub całe obiekty) z powtórzeniami i wyliczać odpowiednio cenę. Możesz wrzucać id (lub całe obiekty) + dla każdego mieć count i wyliczać odpowiednio cenę, możesz mieć same id (lub całe obiekty) + count i  obok w kodzie zmienną totalPriceToPay. Pełna dowolność. Napewno nie wymieniłem wszystkich możliwości.

komentarz 3 dni temu przez ShockWave Bywalec (2,210 p.)
a masz może jakiś przykład z implementacją dla takiego przypadku: " Możesz wrzucać id (lub całe obiekty) + dla każdego mieć count i wyliczać odpowiednio cenę" ?

Podobne pytania

0 głosów
2 odpowiedzi 76 wizyt
+2 głosów
2 odpowiedzi 140 wizyt
0 głosów
1 odpowiedź 54 wizyt
Porady nie od parady
Zadając pytanie postaraj się o odpowiedni tytuł, kategorię oraz tagi.Tagi

85,709 zapytań

134,503 odpowiedzi

298,532 komentarzy

56,629 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...