Calculate multiple fields

2

Good evening, I have been trying to calculate several fields in% with% validating if they are with values, I already did something similar in javascript , but realized that it does not work the way I imagined in javaSE . Basically what I want is to calculate 10 fields, validating if they are with values, and if they are not the same is ignored

Code of what I've tried to do

// Calcula total da nota
function calcularTotalNota()
{
    // Campos
    var valorPrimeiroProduto = document.getElementById("total1").value;
    var valorSegundoProduto = document.getElementById("total2").value;
    var valorTerceiroProduto = document.getElementById("total3").value;
    var valorQuartoProduto = document.getElementById("total4").value;
    var valorQuintoProduto = document.getElementById("total5").value;
    var valorSextoProduto = document.getElementById("total6").value;
    var valorSetimoProduto = document.getElementById("total7").value;
    var valorOitavoProduto = document.getElementById("total8").value;
    var valorNonoProduto = document.getElementById("total9").value;
    var valorDecimoProduto = document.getElementById("total10").value;

    var totaNota = document.getElementById("totalNota").value;

    // Calcula todos os campos
    if(!valorPrimeiroProduto == null)
    {
        totaNota += valorPrimeiroProduto;
    }
}

The result should be shown in javascript

    
asked by anonymous 22.06.2017 / 05:18

1 answer

1

You can use document.getElementsByClassName() to get all fields at once, and assign to array .

  

To make sure the field is not null , just if :

if (valorPrimeiroProduto) { } // só passa se não for nulo
  

You can also check if it is not a NaN (not a number):

if (!isNaN(valorPrimeiroProduto)) { } // passa se for número ou nulo!
  

See a suggestion below:

// Calcula total da nota
function calcularTotalNota()
{
    // Campos
    var inputs = document.getElementsByClassName('total')
    var valor = 0;
    
    for (var i = 0; i < inputs.length; i++) {
        if (inputs[i].value && !isNaN(inputs[i].value)) {
            valor += parseInt(inputs[i].value);
        }
    }
    document.getElementById("resultado").value = valor;
 }
<div>
  <input type="text" value=null name="total" class="total"/>
  <input type="number" value=60 name="total" class="total"/>
  <input type="number" value=null name="total" class="total"/>
  <input type="text" value="trakinas de morango" name="total" class="total"/>
  <input type="number" value=12 name="total" class="total"/>
  <input type="number" value=0 name="total" class="total"/>
</div>
<br>
<div>
  <input type="button" value="Calcula Total" onclick="calcularTotalNota()">
  <input id="resultado" name="resultado" type="text" />
</div>

Sources:
JavaScript - get value from multiple inputs in an array
isNaN ()

    
22.06.2017 / 06:28