Prefill form with jQuery

Question

Have a invoice amount generated by a plugin on page. I want to copy its id into a form field in order to pre-fill it.

<div id="invoicediv">$123.00</div> 

<div id="price"></div>
<br />
<form a`ction="https:/thecart.com" method="post" accept-charset="utf-8">  

<label>Donation Amount:</label><br>  
$<input id="txtBox" size="3" type="text" name="dollaramount">   
<input type="hidden" name="name" value="Donation">   
<input type="submit" value="Donate">  
</form>

jQuery that works:

$('#price').html($('#invoicediv'));

but form doesn't:

$('#txtBox').val($('#invoicediv'));

I also want to remove the dollar sign before it copies itself to the form.

I have the following code so far at http://jsfiddle.net/yvTNc/24/ as well.

score 3 · Answer 1 · answered Sep 15 '12 at 16:39

3

You are copying a jquery object inside the val(), you need $('#invoicediv').val() or .text() depending on what element it is. In this case you'd want $('#invoicediv').text()

Like this

$('#txtBox').val($('#invoicediv').text());

answered Sep 15 '12 at 16:39

Hazem Salama

14,891
5
27
31

If I need to grab the first instance of #txtBox what would be the correct way of doing this? – user1673622 Sep 16 '12 at 05:31
You are grabbing `txtBox` by Id, so technically you are not supposed to have more than one! If you end up with more then you should change your selector to class or something else where you may have multiples. Then to get the first one you could do this `$('.txtBox:first')` – Hazem Salama Sep 16 '12 at 15:50

score 1 · Answer 2 · answered Sep 15 '12 at 16:42

1

I update your code and take a look

http://jsfiddle.net/yvTNc/25/

I changed this line $('#txtBox').val($('#invoicediv'));

to

$('#txtBox').val($('#invoicediv').text().replace('$',''));

answered Sep 15 '12 at 16:42

Muthu Kumaran

17,682
5
47
70

Prefill form with jQuery

2 Answers2