How to multiply one variable by another

1

I would like to know how to multiply my variable price by this part "[value1, value2, value3]" in the following code:

var totalvalores = [valor1, valor2, valor3]
    .reduce(function(total, nr) { 
        return total + (nr || 0); 
    }, 0);

Full Code:

<!DOCTYPE HTML>
<html>
<head>
</head>
<script>
    function calcular() {
        var valor1 = parseInt(document.getElementById('bikemountain').value);
        var valor2 = parseInt(document.getElementById('bikesenhora').value);
        var valor3 = parseInt(document.getElementById('bikecrianca').value);
        var tipo = document.getElementById('tipo').value;
        var tempodesejado = document.getElementById('tempodesejado').value;

        if (tipo == "horas") {
            if (tempodesejado == "2") {
                var preco = "5";
            }
            if (tempodesejado == "4") {
                var preco = "10";
            }
            if (tempodesejado == "6") {
                var preco = "15";
            }
        }

        if (tipo == "dias") {
            if (tempodesejado == "1") {
                var preco = "20";
            }
            if (tempodesejado == "2") {
                var preco = "40";
            }
            if (tempodesejado == "3") {
                var preco = "50";
            }
            if (tempodesejado == "4") {
                var preco = "60";
            }
            if (tempodesejado == "5") {
                var preco = "75";
            }
            if (tempodesejado == "6") {
                var preco = "90";
            }
            if (tempodesejado == "7") {

                var preco = "100";
            }
        }

        var totalvalores = [valor1, valor2, valor3].reduce(function(total, nr) {
            return total + (nr || 0);
        }, 0);

        document.getElementById('precoapagar').innerHTML = totalvalores;
    }

    setInterval("calcular()", 00);
</script>
<form action="verifica1.php" method="post">
    <h3><b>Informações Pessoais</b></h3>
    <br> Nome: <input type="text" name="nome" required>
    <br>
    <br> Tipo de Documento de Identifcação:
    <select>
      <option value="cartaocidadao">Cartão de Cidadão</option>
      <option value="bilheteidentidade">Bilhete de Identidade</option>
      <option value="passaporte">Passaporte</option>
      <option value="cartaconducao">Carta de Condução</option>
    </select>
    <br>
    <br> Telemóvel: <input type="telemovel" required>
    <br>
    <br>
    <b><h3>Levantamento</h3></b> Número de Bicicletas tipo Mountain Bike: <input type="text" name="bikemountain" id="bikemountain">
    <br>
    <br> Número de Bicicletas de Senhora: <input type="text" name="bikesenhora" id="bikesenhora">
    <br>
    <br> Número de Bicicletas de Criança: <input type="text" name="bikecrianca" id="bikecrianca">
    <br>
    <br> Dia de Levantamento:
    <input type="date" name="dialevantamento" required>
    <br>
    <br> Hora de Levantamento
    <input type="time" name="horalevantamento" required>
    <br>
    <br> Tempo Desejado:
    <input type='number' name="tempodesejado" onblur="calcular()" id="tempodesejado" step=1 required>
    <select id="tipo" name="tipo">
      <option value="horas">Horas</option>
      <option value="dias">Dias</option>
    </select>
    <br>
    <br>
    <br> Preço a Pagar: <span id="precoapagar">0</span>€
    <br>
    <br>
    <input type="submit" value="Prosseguir!">
</form>
</html>
    
asked by anonymous 02.06.2016 / 21:28

2 answers

2

Instead of giving strings to variables, you must give numbers, so you can do the math.

Instead of var preco = "100"; use var preco = 100; and then just * preco; at the end of .reduce() like this:

var totalvalores = [valor1, valor2, valor3].reduce(function(total, nr) { 
    return total + (nr || 0); 
}, 0) * (preco || 0);

I suggest you use another alternative to setInterval("calcular()", 00); . This is brutally heavy for the Browser! My suggestion in the other response is much better. If it did not work, say that I'll help you implement.

    
02.06.2016 / 22:11
1

You'll be this you want:

<script>
function calcular() {
  var valor1 = parseInt(document.getElementById('bikemountain').value);
  var valor2 = parseInt(document.getElementById('bikesenhora').value);
  var valor3 = parseInt(document.getElementById('bikecrianca').value);

  var preco = 20;
  var totalvalores = [valor1, valor2, valor3].reduce(function(total, nr) {
    return total + (nr || 0) * preco;
  }, 0);
  document.getElementById('precoapagar').innerHTML = totalvalores;
}
</script>


Número de Bicicletas tipo Mountain Bike: <input value="0" type="number" name="bikemountain" id="bikemountain" value="0">
<br>
<br>
Número de Bicicletas de Senhora: <input value="0" type="number" name="bikesenhora" id="bikesenhora">
<br>
<br>
Número de Bicicletas de Criança: <input type="number" value="0" name="bikecrianca" id="bikecrianca">
<br><br>
<button onclick="calcular();">
ver preço
</button>

<p id="precoapagar">

</p>

In this case the price is always 20, I simplified it a bit, but I think I saw the problem, you have to set a default value, value="0" , in the bicycle numbers if they do not fill and I also made the input type=number instead of% with%. It also takes the price quotes just to ensure that it will be interpreted as number. You should replace them from the second text to if {... , so you do not have to do the checks after one is assumed.

    
02.06.2016 / 21:43