how do i calculate 2 input fields and put results in 3rd input field

Question

i want to have a form whereby i can add a value into the first text field, multiply that by a second hidden field, and display results in a 3rd text field. I want it so as soon as you add a value to the first field it shows the result in the 3rd field, eg on key up.

<label>Qty:</label>
<input name="qty" id="qty" type="text" />
<input name="price" id="price" type="hidden" value="30" /><br />

<label>Total:</label>
<input name="total" id="total" type="text" />

Any help would be great as im new to jquery.

Have a read in the jQuery API about the keypress handler, as well as the val() function. Other than that, its basic maths. — Rory McCrossan
– Rory McCrossan, Commented Aug 18, 2013 at 14:41

Mahajan344 · Accepted Answer · 2013-08-18 15:10:25Z

4

Though you got the answer but you should type cast the values you type in inputs. I mean what if someone type any other value other than integer... then you will get NaN in 3rd textbox..Here is solution to handle this problem

$(document).ready(function(){
    var qty=$("#qty");
    qty.keyup(function(){
        var total=isNaN(parseInt(qty.val()* $("#price").val())) ? 0 :(qty.val()* $("#price").val())
        $("#total").val(total);
    });
});

or you can check jsfiddle http://jsfiddle.net/ugPxf/

answered Aug 18, 2013 at 15:10

Mahajan344

2,5806 gold badges45 silver badges96 bronze badges

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

1 Comment

shaz3e Over a year ago

Can you help me to make this calculator? services.resellerbytes.com/business-email

Akhil5 · Accepted Answer · 2013-08-18 14:46:33Z

4

$("#qty").keyup(function(){
   total = $("#qty").val()* $("#price").val();
   $("#total").val(total);
});

answered Aug 18, 2013 at 14:46

Akhil5

2082 silver badges8 bronze badges

2 Comments

user2489811 Over a year ago

and thanks to Akhil5, your solution worked too. so easy when you know how :)

Sled Over a year ago

Please try to explain why your solution works as well as giving the code.

Rob Schmuecker · Accepted Answer · 2013-08-18 14:45:16Z

0

This should work.

$('#qty').on('keyup',function(){
     $('#total').val( $('#qty').val() * $('#price').val());
});

R.

answered Aug 18, 2013 at 14:45

Rob Schmuecker

8,9642 gold badges21 silver badges34 bronze badges

Collectives™ on Stack Overflow

how do i calculate 2 input fields and put results in 3rd input field

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related