0

I have tree number columns, and create a calculated column to get the sum of the tree inputs , but I have to click save to see change . I'm looking to get the result on the calculated column ,when someone type or change a number in one of the three column before pressing save. I tried this JavaScript code :

function myFunction() {
    var x = document.getElementById("myInput").value;
    document.getElementById("demo").innerHTML = "You wrote: " + x;
}

but in my case I have 3 number columns any idea?

coatless
  • 20,011
  • 13
  • 69
  • 84
ysfibm
  • 436
  • 2
  • 14
  • 30

1 Answers1

1

See the solution below. You'll have to add some validation so that only numbers were allowed 

var inputs = document.getElementsByClassName("myInput");

function myFunction() {
 var total = 0;

    Array.prototype.forEach.call(inputs, function (input) {
        total += +input.value;
    });

    document.getElementsByClassName("myOutput")[0].innerHTML = "The total is: " + total;
}

for (var i = 0; i < inputs.length; i++) {
    inputs[i].addEventListener("input", function () {
        myFunction();
    });
}
<form action="#">
    <input type="text" class="myInput">
    <input type="text" class="myInput">
    <input type="text" class="myInput">
</form>

<div class="myOutput"></div>

What you do is loop through the inputs while attaching the event listener and calculating the total. there are 2 ways to do this, both implemented above.

dhorelik
  • 1,477
  • 11
  • 14
  • your code work just fine , thanks i found this function who work just fine too : http://stackoverflow.com/questions/13540751/how-get-total-sum-from-input-box-values-using-javascript – ysfibm Jul 05 '16 at 10:02
  • how can i apply this function only on two input without using the boucle for? – ysfibm Jul 05 '16 at 12:05