Shopping cart item is not removed

1

I have a dynamically created shopping cart, but the problem is that when I delete an item it even removes it, but if I try to add another item it picks up the one that was removed and adds it back to the shopping cart plus the item that I've added. What will I do wrong? Remember that this cart only shows products for the user and removes them.

Add Code:

  // JQUERY ADICIONAR AO CARRINHO DE COMPRAS
  $(document).on("click",".btn-adicionar-carrinho",function(e)
  {
    // esvaziar o carrinho de compras
    carrinhovazio = $('.car-vazio').empty();
    // id do produto
    var idProduto = $('.nomeproduto').attr("id");
    // nome do produto
    var nomeproduto =  $('.header-ingrediente').text();
    // valor do produto
    var valorproduto = $('.v-lor').text();
    // quantidade do produto
    var quantidadeproduto = $('.item-qtd-produto').text();
    // imagem do produo
    var imagemproduto =  $('.imagemprodseq').data('id-imagem');

    mostraProdutos += "<div class='prodmostra'><div class='imagem-prod' data-id-prod-carrinho=" + idProduto + ">"
    mostraProdutos += "<img class='imagem-carrinho' title='" + nomeproduto + "' src='" + urlBase + "imagem/produto/" +  imagemproduto + "/jpg' alt='Imagem carrinho de compras CloudDelivery' width='100' height='70' />"
    mostraProdutos += "</div><div class='produto'><a href='' style='float: right;' class='excluir-produto-carrinho' title='Retirar produto'>Remover[x]</a><div class='nomeprodutocart'>"+ nomeproduto+ "</div>"
    mostraProdutos += "<div class='qtd-texto'>Quantidade: </div><div class='quantidadeprodutocart'>"+ quantidadeproduto  + "</div><div id='valorprodutocart' class='valorprodutocart'><span>"+ valorproduto +"</span></div></div></div>";
    // mostra os dados do carrinho de compras selecionado
    tabelacarrinho.html(mostraProdutos);

    somaValores();
  });

Delete button code:

      // botão para fechar a tela de produtos do carrinho
      $(document).on("click",".excluir-produto-carrinho", function(e)
      {
        e.preventDefault();
        var c = "";

        if (urlselecionada == valorurl1)
        {
          $(this).fadeOut('slow', function(c)
          {
            var quantitem = 1;
            var contTotal = "";
            var quantcarrinho = $('#quantidadecarrinho').text();
            var idStorage = $('#nomeproduto').text();
            var listaquantcarrinho = $('#quantidadecarrinho');

            contTotal += (quantcarrinho - quantitem);

            $(this).closest('.cart-sec').remove();
            listaquantcarrinho.html(contTotal);
            JSON.stringify(excluirProdutoStorage(idStorage));

          });
        }
        else
        {
          var prodmostra = $(".prodmostra").length;
          //remove o produto conforme o total do carrinho
          var precoproduto = $(this).parent().find('.valorprodutocart span').text().replace('R$','');
          precoproduto = precoproduto.replace(',','.');
          // pega o valor total
          var pegatotalcarrinho = $('.total-carrinho').text().replace('R$','');
          pegatotalcarrinho = pegatotalcarrinho.replace(',','.');
          subtotal = subtrairValorTotal(pegatotalcarrinho, precoproduto);
          replacetotal = formataReal(subtotal);
          resultadoitem = Money.format(replacetotal);
          $(".total-carrinho").html(resultadoitem);

          // remove o item no carrinho de compras
          $(this).parent().parent().remove();

          if (prodmostra == 1)
          {
            carrinhovazio = $('.car-vazio').text('Carrinho vazio');
          }
          else
          {
            carrinhovazio = $('.car-vazio').empty();
          }
        }

      });
    
asked by anonymous 11.08.2017 / 16:18

1 answer

1

Changed as requested.

Follow the code as we talked.

// JQUERY ADICIONAR AO CARRINHO DE COMPRAS
$(document).on("click",".btn-adicionar-carrinho",function(e) {
    // esvaziar o carrinho de compras
    carrinhovazio = $('.car-vazio').empty();
    // id do produto
    var idProduto = $('.nomeproduto').attr("id");
    // nome do produto
    var nomeproduto =  $('.header-ingrediente').text();
    // valor do produto
    var valorproduto = $('.v-lor').text();
    // quantidade do produto
    var quantidadeproduto = $('.item-qtd-produto').text();
    // imagem do produo
    var imagemproduto =  $('.imagemprodseq').data('id-imagem');

    //Alteração 1!
    //Reload a var com os produtos presentes no carrinho.
    //Aqui vamos buscar os valores atuais que estão no carrinho para unir com o novo produto.
    mostraProdutos = tabelacarrinho.html();

    //Carrega o novo produto

    //Alteração 2!
    //Foi criada uma referência para cada produto, onde podemos com facilidade encontrar este elemento e manipular como quisermos.
    mostraProdutos += "<div id='prd_" + idProduto + "'>";

    mostraProdutos += "<div class='prodmostra'><div class='imagem-prod' data-id-prod-carrinho=" + idProduto + ">"
    mostraProdutos += "<img class='imagem-carrinho' title='" + nomeproduto + "' src='" + urlBase + "imagem/produto/" +  imagemproduto + "/jpg' alt='Imagem carrinho de compras CloudDelivery' width='100' height='70' />"
    mostraProdutos += "</div><div class='produto'><a href='' style='float: right;' class='excluir-produto-carrinho' title='Retirar produto'>Remover[x]</a><div class='nomeprodutocart'>"+ nomeproduto+ "</div>"
    mostraProdutos += "<div class='qtd-texto'>Quantidade: </div><div class='quantidadeprodutocart'>"+ quantidadeproduto  + "</div><div id='valorprodutocart' class='valorprodutocart'><span>"+ valorproduto +"</span></div></div></div></div>";
    // mostra os dados do carrinho de compras selecionado
    tabelacarrinho.html(mostraProdutos);

    somaValores();
});

Delete:

// botão para fechar a tela de produtos do carrinho
$(document).on("click",".excluir-produto-carrinho", function(e) {

    e.preventDefault();
    var c = "";

    if (urlselecionada == valorurl1)
    {
      $(this).fadeOut('slow', function(c)
      {
        var quantitem = 1;
        var contTotal = "";
        var quantcarrinho = $('#quantidadecarrinho').text();
        var idStorage = $('#nomeproduto').text();
        var listaquantcarrinho = $('#quantidadecarrinho');

        contTotal += (quantcarrinho - quantitem);

        $(this).closest('.cart-sec').remove();
        listaquantcarrinho.html(contTotal);
        JSON.stringify(excluirProdutoStorage(idStorage));

        //Alteração 3!
        //Remover o produto do carrinho.
        //Busca pela referência que criamos na funcao acima o produto, localiza dentro do html corrente da pagina, e remove o elemento.
        tabelacarrinho.find('#prd_'+ idProduto).remove();

      });
    }
    else
    {
      var prodmostra = $(".prodmostra").length;
      //remove o produto conforme o total do carrinho
      var precoproduto = $(this).parent().find('.valorprodutocart span').text().replace('R$','');
      precoproduto = precoproduto.replace(',','.');
      // pega o valor total
      var pegatotalcarrinho = $('.total-carrinho').text().replace('R$','');
      pegatotalcarrinho = pegatotalcarrinho.replace(',','.');
      subtotal = subtrairValorTotal(pegatotalcarrinho, precoproduto);
      replacetotal = formataReal(subtotal);
      resultadoitem = Money.format(replacetotal);
      $(".total-carrinho").html(resultadoitem);

      // remove o item no carrinho de compras
      $(this).parent().parent().remove();

      if (prodmostra == 1)
      {
        carrinhovazio = $('.car-vazio').text('Carrinho vazio');
      }
      else
      {
        carrinhovazio = $('.car-vazio').empty();
      }
    }

});
    
11.08.2017 / 20:59