jquery read and display in text field

Question

I have a price calculator on my website. I would like jquery to pick the value on one box and send it to the other box in real time.

<form>
How much do you want to spend <input type="text" id="pricein" /><br />
This is how much you will spend<input type="text" id="priceout"/>
</form>

anybody know how this can be accomplished with jquery? This sounds like it might be easy but I'm learning it all slow but I'm learning. Thanks!

kei · Accepted Answer · 2012-07-30 20:22:30Z

7

$("#pricein").keyup(function() {
    $("#priceout").val($("#pricein").val());
});

DEMO

answered Jul 30, 2012 at 20:22

kei

20.5k2 gold badges38 silver badges64 bronze badges

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

2 Comments

james31rock Over a year ago

whoops, should have refreshed the page before I posted my answer.

Finx Over a year ago

that was a working code but what about when the field is a read only field? How would you trigger a recalculation if a number in a field changes? for example, The calculator im using uses formulas to populate some field. for example: #option1 + #option2 = #sum. the div id ="sum" would be an html read field. How do I get it to dynamically readjust the number if it changes?

peacemaker · Accepted Answer · 2012-07-30 20:21:08Z

1

You need the val() function:

var price = $('#pricein').val()

and to set the value:

$('#priceout').val(newValue);

You can read the documentation here

answered Jul 30, 2012 at 20:21

peacemaker

2,5914 gold badges28 silver badges49 bronze badges

Comments

james31rock · Accepted Answer · 2012-07-30 20:26:39Z

1

use keyup

$('#pricein').bind('keyup', function() 
    { 
        $('#priceout').val($(this).val()); 
    });

JSFIDDLE

answered Jul 30, 2012 at 20:26

james31rock

2,7152 gold badges22 silver badges25 bronze badges

Collectives™ on Stack Overflow

jquery read and display in text field

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related