How to multiply one variable by another

Asked

Viewed 467 times

1

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

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

Complete 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>
javascript

2 answers

2


In order to give strings to variables, you must give numbers in order to do the math.

At times var preco = "100"; uses var preco = 100; and then just do * preco; at the end of .reduce() thus:

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 answer is much better. If it didn’t work say I help implement.

  • By replacing the code, I’m back to having the problem that Nan.

  • @Gonçalo corrected.

  • Thanks Sergio is now 100% functional!

1

Will be this who wants:

<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 the always 20, I simplified a little, but I think I saw the problem, you have to put a default value, value="0", in the numbers of bicycles if they do not fill and I also made the input type=number instead of text. Also remove the price quotes just to ensure that it will be interpreted as a number. You should replace them from the second if {... for else if {..., so you don’t need to do the checks after one of them is taken over.

  • It’s not working, Nan appears.

  • Add your html for id bikemountain etc... of the three

  • I’ll post the full code.

  • Take out the price quotes too, see what you get

  • I put the full code.

  • I’m watching @Gonçalo

Show 1 more comment

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.