Update span text from input value

Question

I have an input tag and I want to take its value and put it in a span after a simple calculation. I did it but the value update only when the user hit the "Enter" button. Is there any way to do it dynamicaly? Without pushing the button.

<div class="col-sm-6 col-lg-6 col-md-6">
   Number:<input id="number" type="int" onchange="updateInput(this.value)">
</div>
<div class="col-sm-6 col-lg-6 col-md-6">
   Total <span id="result"></span>
</div>

<script type="text/javascript">
  function updateInput(ish){
    document.getElementById("result").innerHTML = ish*0.05
}
</script>

freakinthesun · Accepted Answer · 2014-04-14 20:44:54Z

4

j08691's answer will work, but it won't include all ways that the user can update the value (such as pasting it). This should cover everything:

$("#number").bind("propertychange change keyup paste input", function () {
    document.getElementById("result").innerHTML = $("#number").val()*0.05;
});

answered Apr 14, 2014 at 20:44

freakinthesun

7091 gold badge9 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

j08691 · Accepted Answer · 2014-04-14 20:42:44Z

1

The easiest solution would be to change:

onchange="updateInput(this.value)"

to

onkeyup="updateInput(this.value)"

jsFiddle example

answered Apr 14, 2014 at 20:42

j08691

208k33 gold badges269 silver badges281 bronze badges

Collectives™ on Stack Overflow

Update span text from input value

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related