• 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
Wynikowy wygląd pytania, odpowiedzi czy komentarza, różni się od tego zaprezentowanego w edytorze postów. Stosuj więc funkcję Podgląd posta znajdującą się pod edytorem, aby upewnić się, czy na pewno ostateczny rezultat ci odpowiada.Podgląd posta

85,708 zapytań

134,503 odpowiedzi

298,528 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.

...