Add subtotal with jquery

Question

Add subtotal with jquery

Navigation

#1 by (0 votes)

0

Good afternoon,

Access this site: conepa.agenciaweblab.com.br/inscricoes Guys, I have a problem, in my cart system, I am getting multiply the value with the amount of each loop, however I am not doing the cart loop with javascript, I am doing with php, and I need to add the values of the subtotals, I would like some solution. Main fields:

<td class="price-col" id="preco_<?= $list_cart->post_id; ?>" data-valor="<?= $list_cart->post_valor; ?>"><?= $list_cart->post_valor; ?></td>
<td class="quantity-col">
   <input type="number" onChange="Multiplica(<?= $list_cart->post_id; ?>)" class="form-control qtd_<?= $list_cart->post_id; ?>" <?= $disabled; ?> min="1" max="<?= $list_cart->post_quantidade; ?>" placeholder="0" required="">

and now jquery:

function Multiplica(id) {

    var valor = $('#preco_' + id).text();
    var quantidade = $('.qtd_' + id).val();
    var total = valor * quantidade;
    document.getElementById('sub_' + id).innerHTML = number_format(total, '2', ',', '.');

    var totals = 0;
    $('#preco_' + id).each(function () {
        totals += (valor * quantidade);
    });
    $("#totalSoma").text(totals);
}

Someone to help? I just need the sum total, which I did, did not have much success.

php javascript jquery

asked by anonymous 04.11.2017 / 18:39

1 answer

Firebase with Javascript - Get the child's title from the database Error updating profile photo laravel

score 0 · Accepted Answer

There is only one mistake in $('#preco_' + id).each(function () {}); , since it only runs for a single td that is on the same line as the input that changed the quantity. I imagine you wanted all td tags that have id starting with preco_ to be accessed and the total quantity was calculated. For this, a small change in your search is enough. See:

function Multiplica(id) {

        var valor = $('#preco_' + id).text();
        var quantidade = $('.qtd_' + id).val();
        var total = valor * quantidade;
        document.getElementById('sub_' + id).innerHTML = number_format(total, '2', ',', '.');

        var totals = 0;
        //procura todos os elementos em que o id começa com preco_ e que está dentro de uma td
        $("td[id^='preco_']").each(function () {
            //conteudo da tag td que tem id começando com #preco_
            var valor = $(this).text();
            //encontra a tag tr pai da tag td, depois encontra a tag quantity-col 
            //e retorna o valor do input
            var quantidade = $(this).parent().find('.quantity-col').find('input').val();

            totals += (valor * quantidade);
        });
        $("#totalSoma").text(number_format(totals, '2', ',', '.'));
    }

Optionally you can search using the price-col class. So:

$(".price-col").each(function () {
            //conteudo da tag td que tem id começando com #preco_
            var valor = $(this).text();
            //encontra a tag tr pai da tag td, depois encontra a tag quantity-col 
            //e retorna o valor do input
            var quantidade = $(this).parent().find('.quantity-col').find('input').val();

            totals += (valor * quantidade);
        });

To show the total quantity first modify this html snippet:

<tbody><tr>
    <td>Quantidade:</td>
    <td id="totalQuantidade">0</td>
</tr>

And in the multiply function change to:

var quantidades = 0;
        //procura todos os elementos em que o id começa com preco_ e que está dentro de uma td
        $(".price-col").each(function () {
            //conteudo da tag td que tem id começando com #preco_
            var valor = $(this).text();
            //encontra a tag tr pai da tag td, depois encontra a tag quantity-col 
            //e retorna o valor do input
            var quantidade = $(this).parent().find('.quantity-col').find('input').val();

            if(quantidade != ''){
                quantidades = parseInt(quantidade) + quantidades;
            }
            totals += (valor * quantidade);

        });
        $("#totalSoma").text(number_format(totals, '2', ',', '.'));

        $("#totalQuantidade").html(quantidades);