How to keep the values of a calculation with inputs in Javascript?

Navigation
1

I want to calculate the OHM law (i = v / r) and I have three <input> and one button with onClick="dividir()" to call the next function in my HTML: 

function dividir() {
    v = document.getElementById("voltaje").value;
    r = document.getElementById("resistencia").value;
    i = v / r;
    document.getElementById("corriente").value = i;
};

The function fulfills its purpose but the result value and only appears a few seconds and disappears.

HTML Code: 

<div class="container app-contenedor">
    <form class="form-inline">
        <div class="form-group">
            <label>V</label>
            <input type="text" class="app-input" id="voltaje"></input>
        </div>
        <div class="form-group">
            <label>R</label>
            <input type="text" class="app-input" id="resistencia"></input>
        </div>
        <div class="form-group">
            <label>I</label>
            <input type="text" class="app-input" id="corriente"></input>
        </div>
        <div class="">
            <button class="btn app-resultado app-resultado-boton" type="submit" id="calcular" onclick="dividir()">Calcular</button>
        </div>
    </form>
</div>

How can I let the result be displayed in the text field? or should you create another element that reflects the result of the division instead?

    
asked by Joel Buenrostro 29.02.2016 в 20:13
source

4 answers

2

Based on your code, the problem is here: 

<button class="btn app-resultado app-resultado-boton" type="submit" id="calcular" onclick="dividir()">Calcular</button>

Remove the type="submit" of the HTML component: 

<button class="btn app-resultado app-resultado-boton" id="calcular" onclick="dividir()">Calcular</button>
    
answered by 01.03.2016 / 21:15
source
0

Why not try to store the variable somewhere, it can be the cache, and then send it to call: 

sessionStorage.setItem('clave', 'valor');

Saves the value information that can be accessed by invoking a key. For example, the key can be Francisco's name and value.

    
answered by 29.02.2016 в 22:30
0

My mistake was in having a button type="submit" that was validating the values, thanks to everyone for their answers.

    
answered by 01.03.2016 в 18:06
-1

I understand that what you want to do looks like this: 

<!DOCTYPE html>
<SCRIPT>
function dividir() {
    v = document.getElementById("voltaje").value;
    r = document.getElementById("resistencia").value;
    i = v / r;
    document.getElementById("corriente").value = i;
};
</SCRIPT>
voltaje <input id=voltaje><br>
resistencia <input id=resistencia<br>
corriente <input id=corriente><br>>
<button onclick="dividir()">Calcular</button>

That simple example works, so if it appears a few seconds, and disappears, you will have problems with another code or CSS that you have not commented.

    
answered by 29.02.2016 в 23:59
Is it possible to make my own API from a site that does not have an API with Python? Increase in loop For not working