-5

Não estou conseguindo as casas decimais corretas, onde está o erro?

function calcula() {

  var total = 0;
  $("span[id^=linha]:visible").each(function() {

    var val_unit = parseFloat($(".class_unit input", this).val().replace(",", "."));
    var qnt = $(".class_quant input", this).val();
    var sub_total = val_unit * qnt;

    if (!isNaN(sub_total)) $(".class_total input", this).val(sub_total.toFixed(2).replace(".", ","));

    total += parseFloat($("input[id^=total]", this).val().replace(",", "."));

    somar();

  });

  if (!isNaN(total)) $("#total input.value_total").val(total.toFixed(2).replace(".", ","));

}


//Total máximo de campos que você permitirá criar em seu site:
var totalCampos = 10;

//Não altere os valores abaixo, pois são variáveis controle;
var iLoop = 1;
var iCount = 0;
var linhaAtual;


function AddCampos() {
  var hidden1 = document.getElementById("hidden1");
  var hidden2 = document.getElementById("hidden2");

  //Executar apenas se houver possibilidade de inserção de novos campos:
  if (iCount < totalCampos) {

    //Limpar hidden1, para atualizar a lista dos campos que ainda estão vazios:
    hidden2.value = "";

    //Atualizando a lista dos campos que estão ocultos.
    //Essa lista ficará armazenada temporiariamente em hidden2;
    for (iLoop = 1; iLoop <= totalCampos; iLoop++) {
      if (document.getElementById("linha" + iLoop).style.display == "none") {
        if (hidden2.value == "") {
          hidden2.value = "linha" + iLoop;
        } else {
          hidden2.value += ",linha" + iLoop;
        }
      }
    }
    //Quebrando a lista que foi armazenada em hidden2 em array:

    linhasOcultas = hidden2.value.split(",");


    if (linhasOcultas.length > 0) {
      //Tornar visível o primeiro elemento de linhasOcultas:
      document.getElementById(linhasOcultas[0]).style.display = "block";
      iCount++;

      //Acrescentando o índice zero a hidden1:
      if (hidden1.value == "") {
        hidden1.value = linhasOcultas[0];
      } else {
        hidden1.value += "," + linhasOcultas[0];
      }

      /*Retirar a opção acima da lista de itens ocultos: <-------- OPCIONAL!!!
      if (hidden2.value.indexOf(","+linhasOcultas[0]) != -1) {
      hidden2.value = hidden2.value.replace(linhasOcultas[0]+",","");
      }else if (hidden2.indexOf(linhasOcultas[0]+",") == 0) {
      hidden2.value = hidden2.value.replace(linhasOcultas[0]+",","");
      }else{
      hidden2.value = "";
      }
      */
      calcula();
    }
  }
}

function RemoverCampos(id) {
  //Criando ponteiro para hidden1:        
  var hidden1 = document.getElementById("hidden1");

  //Pegar o valor do campo que será excluído:
  var campoValor = document.getElementById("valor_unitario" + id).value;
  //Se o campo não tiver nenhum valor, atribuir a string: vazio:
  if (campoValor == "") {
    campoValor = "vazio";
  }

  if (confirm("O campo que contém o valor:\n» " + campoValor + "\nserá excluído!\n\nDeseja prosseguir?")) {
    document.getElementById("linha" + id).style.display = "none";
    iCount--;

    //Removendo o valor de hidden1:
    if (hidden1.value.indexOf(",linha" + id) != -1) {
      hidden1.value = hidden1.value.replace(",linha" + id, "");
    } else if (hidden1.value.indexOf("linha" + id + ",") == 0) {
      hidden1.value = hidden1.value.replace("linha" + id + ",", "");
    } else {
      hidden1.value = "";
    }

    calcula();
  }
}

$(document).ready(function() {
  $('span[id^=linha] input').on("input", calcula);
});

//Escrevendo o código-fonte HTML e ocultando os campos criados:
for (iLoop = 1; iLoop <= totalCampos; iLoop++) {
  document.write("<span id='linha" + iLoop + "' style='display:none'><div class='class_unit'>Valor Unitário " + iLoop + ":<input type='text' name='valor_unitario" + iLoop + "' id='valor_unitario" + iLoop + "' /></div><div class='class_quant'>Quantidade " + iLoop + ": <input type='text' name='qnt" + iLoop + "' id='qnt" + iLoop + "' value='0' /></div><div class='class_total'>SubTotal " + iLoop + ": <input type='text' name='total" + iLoop + "' id='total" + iLoop + "' readonly='readonly' /></div> <input type='button' value='Remover' onclick='RemoverCampos(\"" + iLoop + "\")'></span>");
}


function somar() {
  var valor1 = parseInt(document.getElementById("v_total").value);
  var valor2 = parseInt(document.getElementById("v_total2").value);
  document.getElementById("v_totalG").value = (valor1 + valor2).toFixed(2);


}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="form1" action="" method="post">

  <div class="class_total" id="total">Total: <input id="v_total" class="value_total" readonly></input>
  </div>
  <br><br><br>
  <input type="button" value="Adicionar campos" onclick="AddCampos()">
  <br><br><input type="text" name="hidden1" id="hidden1">
  <input type="hidden" name="hidden2" id="hidden2">


  <div class="class_total2" id="total2">Total2: <input id="v_total2" class="value_total2" value="12,50" readonly></input>
  </div>


  <div id="totalG" class="class_totalG">TotalG: <input id="v_totalG" class="value_totalG" readonly></input>
  </div>
</form>

Agradeço.

0

1 Resposta 1

1

Primeiro que você está chamando a função somar() dentro do laço .each, o que vai ocasionar problemas. A função deve ser chamada após o laço, quando os valores tiverem sido calculados.

Depois você precisa usar parseFloat e não parseInt para trabalhar com casas decimais, mas antes é preciso substituir a vírgula por ponto. Ex.:

var valor1 = parseFloat(document.getElementById("v_total").value.replace(",", "."));

E depois do toFixed(2), substituir de volta o ponto pela vírgula.

function calcula(){
   
   var total = 0;
   $("span[id^=linha]:visible").each(function(){
      
      var val_unit = parseFloat($(".class_unit input", this).val().replace(",", "."));
      var qnt = $(".class_quant input", this).val();
      var sub_total = val_unit * qnt;

      if(!isNaN(sub_total)) $(".class_total input", this).val(sub_total.toFixed(2).replace(".", ","));
      
      total += parseFloat($("input[id^=total]", this).val().replace(",", "."));
      
   });

   if(!isNaN(total)) $("#total input.value_total").val(total.toFixed(2).replace(".", ","));
      somar();
   
}


//Total máximo de campos que você permitirá criar em seu site:
var totalCampos = 10;

//Não altere os valores abaixo, pois são variáveis controle;
var iLoop = 1;
var iCount = 0;
var linhaAtual;


function AddCampos() {
   var hidden1 = document.getElementById("hidden1");
   var hidden2 = document.getElementById("hidden2");

   //Executar apenas se houver possibilidade de inserção de novos campos:
   if (iCount < totalCampos) {

      //Limpar hidden1, para atualizar a lista dos campos que ainda estão vazios:
      hidden2.value = "";

      //Atualizando a lista dos campos que estão ocultos.
      //Essa lista ficará armazenada temporiariamente em hidden2;
      for (iLoop = 1; iLoop <= totalCampos; iLoop++) {
         if (document.getElementById("linha"+iLoop).style.display == "none") {
            if (hidden2.value == "") {
               hidden2.value = "linha"+iLoop;
            }else{
               hidden2.value += ",linha"+iLoop;
            }
         }
      }
      //Quebrando a lista que foi armazenada em hidden2 em array:

      linhasOcultas = hidden2.value.split(",");


      if (linhasOcultas.length > 0) {
         //Tornar visível o primeiro elemento de linhasOcultas:
         document.getElementById(linhasOcultas[0]).style.display = "block"; iCount++;
      
         //Acrescentando o índice zero a hidden1:
         if (hidden1.value == "") {
            hidden1.value = linhasOcultas[0];
         }else{
            hidden1.value += ","+linhasOcultas[0];
         }
      
         /*Retirar a opção acima da lista de itens ocultos: <-------- OPCIONAL!!!
         if (hidden2.value.indexOf(","+linhasOcultas[0]) != -1) {
         hidden2.value = hidden2.value.replace(linhasOcultas[0]+",","");
         }else if (hidden2.indexOf(linhasOcultas[0]+",") == 0) {
         hidden2.value = hidden2.value.replace(linhasOcultas[0]+",","");
         }else{
         hidden2.value = "";
         }
         */
         calcula();
      }
   }
}

function RemoverCampos(id) {
   //Criando ponteiro para hidden1:        
   var hidden1 = document.getElementById("hidden1");

   //Pegar o valor do campo que será excluído:
   var campoValor = document.getElementById("valor_unitario"+id).value;
   //Se o campo não tiver nenhum valor, atribuir a string: vazio:
   if (campoValor == "") {
      campoValor = "vazio";
   }

   if(confirm("O campo que contém o valor:\n» "+campoValor+"\nserá excluído!\n\nDeseja prosseguir?")){
      document.getElementById("linha"+id).style.display = "none"; iCount--;
   
      //Removendo o valor de hidden1:
      if (hidden1.value.indexOf(",linha"+id) != -1) {
         hidden1.value = hidden1.value.replace(",linha"+id,"");
      }else if (hidden1.value.indexOf("linha"+id+",") == 0) {
         hidden1.value = hidden1.value.replace("linha"+id+",","");
      }else{
         hidden1.value = "";
      }
      
      calcula();
   }
}

$(document).ready(function(){
   $('span[id^=linha] input').on("input", calcula);
});

//Escrevendo o código-fonte HTML e ocultando os campos criados:
for (iLoop = 1; iLoop <= totalCampos; iLoop++) {
   document.write("<span id='linha"+iLoop+"' style='display:none'><div class='class_unit'>Valor Unitário "+iLoop+":<input type='text' name='valor_unitario"+iLoop+"' id='valor_unitario"+iLoop+"' /></div><div class='class_quant'>Quantidade "+iLoop+": <input type='text' name='qnt"+iLoop+"' id='qnt"+iLoop+"' value='0' /></div><div class='class_total'>SubTotal "+iLoop+": <input type='text' name='total"+iLoop+"' id='total"+iLoop+"' readonly='readonly' /></div> <input type='button' value='Remover' onclick='RemoverCampos(\""+iLoop+"\")'></span>");
}


function somar(){
    var valor1 = parseFloat(document.getElementById("v_total").value.replace(",", "."));
    var valor2 = parseFloat(document.getElementById("v_total2").value.replace(",", "."));
    var totalG = valor1 + valor2;
    if(!isNaN(totalG)) document.getElementById("v_totalG").value = totalG.toFixed(2).replace(".", ",");

   
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="form1" action="" method="post">

   <div class="class_total" id="total">Total: <input id="v_total" class="value_total" readonly></input> </div>
   <br><br><br>
   <input type="button" value="Adicionar campos" onclick="AddCampos()">
   <br><br><input type="text" name="hidden1" id="hidden1">
   <input type="hidden" name="hidden2" id="hidden2">


   <div class="class_total2" id="total2">Total2: <input id="v_total2" class="value_total2" value="12,50" readonly></input> </div>

   
   <div id="totalG" class="class_totalG">TotalG: <input id="v_totalG" class="value_totalG" readonly></input> </div>
</form>

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