0

Boa noite.

Eu estou com um problema que é o seguinte; Tenho um formulário que é gerada por um foreach, onde mostra valores de ingressos. Nesse formulário você pode adicionar a quantidade que deseja comprar de vários ingressos. Eu preciso mostrar no final do formulário o valor total de todos os ingressos comprados. Eu estou tentando fazer via localStorage só que não estou conseguindo gerar a soma corretamente.

Código na view onde gera o formulário.

<?php if ($lotes) : ?>
                        <?php foreach ($lotes as $lote) : ?>
                            <div class="row">
                                <div class="col-sm-8">
                                    <div class="form-group">
                                        <strong>
                                            <label><i class="icon-ticket"></i> <?php echo $lote->ingresso_nome . ' - ' . $lote->lote_ingresso_nome . ' - R$ ' . converteDecimalDinheiro($lote->lote_ingresso_valor); ?>
                                        </strong></label>
                                        <span id="ingresso" hidden><?php echo converteDecimalDinheiro($lote->lote_ingresso_valor);?> </span>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-6">
                                    <div class="form-group">
                                        <label>Quantidade</label>
                                        <div class="numbers-row">
                                            <input type="text" value="0" id="quantidade" class="qty2 form-control" name="quantidade[]">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6" align="right">
                                    <div class="form-group">
                                        <label>Sub Total</label>
                                        <h4>
                                            <input type="hidden" name="lote_ingresso[]" value="<?php echo $lote->lote_ingresso_id; ?>" />
                                            <input id="valor-ingresso" type="hidden" name="valor_ingresso" value="<?php echo $lote->lote_ingresso_valor; ?>" />
                                            <strong id="valor-total">0,00</strong>
                                        </h4>
                                    </div>
                                </div>
                            </div>
                            <br>
                            <table class="table table_summary">
                                <tbody>
                                    <tr>
                                        <td>
                                            Conveniência
                                        </td>
                                        <td class="text-right">
                                            <input id="valor-taxa" type="hidden" name="valor_taxa" value="<?php echo $evento->evento_taxa_conveniencia; ?>" />
                                            <?php echo converteDecimalDinheiro($evento->evento_taxa_conveniencia) . ' %'; ?>
                                        </td>
                                    </tr>
                                    <tr>
                                    </tr>
                                    <tr class="total">
                                        <td>
                                            Total
                                        </td>
                                        <td class="text-right" id="valor-total-taxa">0,00</td>
                                    </tr>
                                </tbody>
                            </table>
                        <?php endforeach; ?>
                    <?php endif; ?>

e aqui o código javascript que estou fazendo.

$(".button_inc").on("click", function() {
    console.log(localStorage.getItem('total'));
    var $button = $(this);
    var oldValue = $button.parent().find("input").val();
    var Total =  parseFloat(localStorage.getItem('total'));
    if ($button.text() == "+") {
        var newVal = parseFloat(oldValue) + 1;
        var valorTotal = parseFloat(newVal * $button.parent().parent().parent().parent().find("input[id='valor-ingresso']").val());

        var valorTotalTaxa = Number(valorTotal + (valorTotal * $('#valor-taxa').val() / 100)).toFixed(2);
        $button.parent().parent().parent().parent().find("strong[id='valor-total']").html('R$ ' + numeroParaMoeda(Number((valorTotal)).toFixed(2)));
        $button.parent().parent().parent().parent().next().next().find("td[id='valor-total-taxa']").html('R$ ' + numeroParaMoeda(valorTotalTaxa));

        var values = Request.Form["valor-total"].Split(',');
        valorTotalTaxa = parseFloat(valorTotalTaxa);

        console.log('dsfs'+ $('#valor-total').length);
        console.log(values);               
        console.log(Number(localStorage.getItem('total')).toFixed(2));

    } else {
        // Don't allow decrementing below zero
        if (oldValue > 1) {
            var newVal = parseFloat(oldValue) - 1;
            var valorTotal = parseFloat(newVal * $button.parent().parent().parent().parent().find("input[id='valor-ingresso']").val());
            var valorTotalTaxa = Number(valorTotal + (valorTotal * $('#valor-taxa').val() / 100)).toFixed(2);
            $button.parent().parent().parent().parent().find("strong[id='valor-total']").html('R$ ' + numeroParaMoeda(Number((valorTotal)).toFixed(2)));
            $button.parent().parent().parent().parent().next().next().find("td[id='valor-total-taxa']").html('R$ ' + numeroParaMoeda(valorTotalTaxa));
        } else {
            newVal = 0;
            $button.parent().parent().parent().parent().find("strong[id='valor-total']").html('R$ 0,00');
            $button.parent().parent().parent().parent().next().next().find("td[id='valor-total-taxa']").html('R$ 0,00');
        }
    }
    $button.parent().find("input").val(newVal);
});

inserir a descrição da imagem aqui

acima um exemplo de como fica o formulário , no console eu mostro a soma. Gostaria de uma luz de onde tá o erro, se alguém achar ou até mesmo se tem uma forma mais tranquila de fazer.

Vlw

1 Resposta 1

0

Amigo,talvez isso possa te ajudar: Adicionar algum evento nos inputs de quantidade (no meu caso usei o 'blur'), utilizar a função 'each' para percorrer todos as quantidades, soma-las e atualizar o total geral.

Espero que ajude, abç.

  $(document).ready(function(){
        $(".qtd").on("blur", function(){
            var ar = []; // Total array
            var qtd = $(this).val(); 
            var qtdUnitaria = $(this).attr("data-unit");
            var totalLinha = qtd * qtdUnitaria; // Total da linha
            
            $(this).next('input').val(totalLinha); // Atualiza o valor total da linha
            
            $('.qtd').each(function(){
                var val = $(this).next('input').val();
                if(val){
                    ar.push(val);
                }else{
                    ar.push(0);
                }
            });

            var total = 0;
            for(var i=0;i < ar.length;i++) {
                total += parseFloat(ar[i]);
            }
            $(".total").html(total);
        });
    })
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

          <ul>
            <li>
                <span>Ingresso show mamonas</span><br>
                <span>Valor unitário:750</span><br>
                Quantidade: <input class="qtd" data-unit="750" type="number"/>
                Subtotal: <input class="subTotal" type="number"/>
            </li><hr>
            
            <li>
                <span>Ingresso show Ramones</span><br>
                <span>Valor unitário:1200</span><br>
                Quantidade: <input class="qtd" data-unit="1200" type="number"/>
                Subtotal: <input class="subTotal" type="number"/>
            </li><hr>

            <li>
                <span>Ingresso show garotos podres</span><br>
                <span>Valor unitário: 350</span><br>
                Quantidade: <input class="qtd" data-unit="350" type="number"/>
                Subtotal: <input class="subTotal" type="number"/>
            </li><hr>
        </ul>
        <div>Total: <span class="total"></span></div>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .