jquery .keyup event on input not firing

Question

I am trying to have a simple addition calculation when an input is keyup'ed. Here is my html:

<tr id="a">
        <td>
            <label>A</label>
        </td>
        <td>
            <label>Results/Action Orientation (asset)</label>
        </td>
        <td class="shade">
            <input id="a_per" type="text" />
        </td>
        <td class="shade">
            <input id="a_pot" type="text" />
        </td>
        <td class="shade">
            <input id="a_tot" class="totals" type="text" disabled="disabled" />
        </td>
</tr>

And here is my jQuery for the keyup event:

$('#a_per').keyup(function() {
    if($('#a_pot').value != "") {
        var tot = this.value + $('#a_pot').value;
        $('#a_tot').value = tot;
    }
});

I am going to tailor it to fire when either #a_per or #a_pot keyup but first I want to make sure this will work.

Any help is appreciated. Thanks.

Alexander · Accepted Answer · 2012-05-15 21:12:44Z

2

Another alternative:

$('#a_per,#a_pot').keyup(function() {
  var a_per = +$('#a_per').val() || 0;
  var a_pot = +$('#a_pot').val() || 0;
  $('#a_tot').val(a_per + a_pot);
});

A working example.

edited May 15, 2012 at 21:12

answered May 15, 2012 at 20:53

Alexander

23.5k11 gold badges65 silver badges74 bronze badges

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

6 Comments

ahhchuu Over a year ago

Wouldn't this still need casting to int/float?

Alexander Over a year ago

You could say this autocast itself. Being honest I think it is the better answer.

ahhchuu Over a year ago

I am not a javascript/jQuery expert so excuse my ignorance. What are the advantages of this method over those listed above? If it is more efficient I will use it. It isn't as readable as the above examples though.

Alexander Over a year ago

You would like to read How do I Convert a String into an Integer in JavaScript?

ahhchuu Over a year ago

Will do, thanks for the advice and help. I have been looking at your answer more and agree with you now. I didn't notice all that was going on. I am switching yours to the answer. Thanks again. :)

|

j08691 · Accepted Answer · 2012-05-15 20:53:29Z

1

Change your use of .value to .val(). You'll also want to apply parseFloat or parseInt to your addition function, otherwise you'll end up concatenating strings. Also wrap this is jQuery tags like:

$('#a_per').keyup(function() {
    if($('#a_pot').val() != "") {
        var tot = parseFloat($(this).val()) + parseFloat($('#a_pot').val());
        $('#a_tot').val(tot);
    }
});

edited May 15, 2012 at 20:53

answered May 15, 2012 at 20:47

j08691

208k33 gold badges269 silver badges281 bronze badges

5 Comments

ahhchuu Over a year ago

Awesome! This fixed it. I will set to answer once stackoverflow lets me. Thanks a lot. :)

j08691 Over a year ago

No problem. You may also want to consider checking for non-numeric input.

ahhchuu Over a year ago

I will be adding validation to it yet. I switched over to parseInt as I will not be accepting any floats. I assume that parseInt is faster than parseFloat, although it would probably not be noticable.

j08691 Over a year ago

Not noticeable by much. When using parseInt, make sure you add the radix parameter. E.g. parseInt($(this).val(),10).

ahhchuu Over a year ago

Forgot about that. Thanks. Set to answer now.

Shyju · Accepted Answer · 2012-05-15 20:54:13Z

1

use val(), not value.

$(function(){

   $('#a_per').keyup(function() {
     var item=$(this);

      if(item.val() != "") {
         var tot = parseInt(item.val()) + parseInt($('#a_pot').val());
         $('#a_tot').val(tot);
      }
   });

});

Working sample : http://jsfiddle.net/zzS3U/9/

answered May 15, 2012 at 20:54

Shyju

220k106 gold badges421 silver badges499 bronze badges

Collectives™ on Stack Overflow

jquery .keyup event on input not firing

3 Answers 3

6 Comments

5 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related