Multiplying field value with retreived value jQuery
- by Efe
I pull product price from another page. Then I multiply it with quantity entered in the quantity input field. The problem is, if I forget to enter quantity value before I pull product price data or if I change the quantity field later, the final total price is not updated. I hope I clearly explained it.
javascript:
$('#AddProduct').click(function() {
var i = 0;
var adding = $(+(i++)+'<div class="row'+(i)+'"><div class="column width50"><input type="text" id="PRODUCTNAME" name="PRODUCTNAME'+(i)+'" value="" class="width98" /><input type="hidden" class="PRODUCTID" name="PRODUCTID" /><input type="hidden" class="UNITPRICE" name="UNITPRICE'+(i)+'" /><small>Search Products</small></div><div class="column width20"><input type="text" class="UNITQUANTITY" name="UNITQUANTITY'+(i)+'" value="" class="width98" /><small>Quantity</small></div><div class="column width30"><span class="prices">Unit Price:<span class="UNITPRICE"></span><br />Total Price:<span class="TOTALPRICE"></span><br /><a href="#" id="RemoveProduct(".row'+(i)+'");">Remove</a></span></div>');
$('#OrderProducts').append(adding);
adding.find("#PRODUCTNAME").autocomplete("orders.cs.asp?Process=ListProducts", {
selectFirst: false
}).result(function(event, data, formatted) {
if (data) {
adding.find(".UNITPRICE").html(data[1]);
adding.find(".PRODUCTID").val(data[2]);
adding.find(".TOTALPRICE").html(data[1] * $('.UNITQUANTITY').val());
}
});
return false;
});
$('#RemoveProduct').click(function() {
$().remove();
return false;
});
my html:
<fieldset>
<h2>Order Items</h2>
<div id="OrderProducts">
<a href="#" id="AddProduct"><img src="icons/add.png" alt="Add" /></a>
</div>
</fieldset>
edit
Now I totaly messed it up. Removing a row is not working anymore as well...
Test link:
http://refinethetaste.com/html/cp/?Section=orders&Process=AddOrder#
