This is the last problem i have with my form (hopefully)
What I want to do is append the var size to my hidden input called my-item-name
I have tried adding this
form.find('[name=my-item-name]').append(size.val());
but it doesn't work.
What is the correct way to append the size val to the input?
<form method="post" action="" class="jcart">
<fieldset>
<input type="hidden" name="jcartToken" value="13823c48f896c49403465fcce9f135ac" />
<input type="hidden" name="my-item-id" value="12" />
<input type="hidden" name="my-item-price" value="15.99" />
<input type="hidden" name="my-item-url" value="http://yahoo.com" />
<input type="hidden" name="my-item-name" value="Operation Braveheart hooded sweatshirt" />
<ul>
<li>
<select name="my-select" id="foo12">
<option value='Small'>Small</option>
<option value='Medium'>Medium</option>
<option value='Large'>Large</option>
<option value='X-Large'>X-Large</option>
</select>
</li>
<li>Price: $<span id="price12" class="price">15.99</span></li>
<li>
<label>Qty: <input type="text" name="my-item-qty" value="1" size="3" /></label>
</li>
</ul>
<input type="submit" name="my-add-button" value="add to cart" class="button" />
</fieldset>
</form>
<script type="text/javascript">
var item_prices_by_size12 = { "Small": { "Price": "15.99", "ItemId": "9-1" },"Medium": { "Price": "16.99", "ItemId": "9-2" },"Large": { "Price": "17.99", "ItemId": "9-3" },"X-Large": { "Price": "18.99", "ItemId": "9-4" }};
$(function() {
$('#foo12').change(function() {
var form = $(this).parents('form');
// Size is whatever the value the user has selected
var size = $(this).val();
// Determine the correct price and item ID based on the selected size
var price12 = item_prices_by_size12[size].Price,
itemId = item_prices_by_size12[size].ItemId;
form.find('#price12').text(price12);
form.find('[name=my-item-price]').val(price12);
// Update the item ID
form.find('[name=my-item-id]').val(itemId);
form.find('[name=my-item-name]').append(size.val());
});
});
</script>
To append an element with a text message when the input field is changed, change() and appendTo() methods are used. The change() method is used to detect the change in the value of input fields. This method works only on the “<input>, <textarea> and <select>” elements.
To append text to an element: Use the document. createTextNode() method to create a text node. Use the appendChild() method to append the text node to the element.
jQuery append() Method The append() method inserts specified content at the end of the selected elements. Tip: To insert content at the beginning of the selected elements, use the prepend() method.
append: "Insert content, specified by the parameter, to the end of each element in the set of matched elements."
What you want to do is append to the value I think?
var value = form.find('[name=my-item-name]').val();
form.find('[name=my-item-name]').val(value + size);
If you mean concatenate:
$('[name=my-item-name]').val($('[name=my-item-name]').val()+""+size);
(Reading your code size is already the val of the object so you can't call size.val()
)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With