Умножение значения поля на полученное значение jQuery

Question

Я вытащил цену товара с другой страницы. Затем я умножаю его на количество, введенное в поле ввода количества. Проблема в том, что если я забуду ввести значение количества до того, как получу данные о цене продукта, или если я изменю поле количества позже, итоговая итоговая цена не обновится. Надеюсь, я четко объяснил это.

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;
});

мой HTML:

        <fieldset>
            <h2>Order Items</h2>
            <div id="OrderProducts">
                <a href="#" id="AddProduct"><img src="icons/add.png" alt="Add" /></a>
            </div>  
        </fieldset>

• 1010 * редактировать *

Теперь я все испортил. Удаление строки больше не работает ...

Answer 1

для удаления ссылки вы можете попробовать это:

<a href="#"  id="row'+i+'");" class="remove">Remove</a></span>

$('a.remove').live('click',function() {
     $('div.'+$(this).attr('id')).remove();
});

Answer 2

Вы можете сделать что-то вроде этого:

 $('input.UNITQUANTITY').blur(function() {
     var $column = $(this).closest('div.column');
     var unit = $column.find('.UNITPRICE').html();
     $column.find('.TOTALPRICE').html(unit * $(this).val());
 });

Я не уверен, как настроен ваш HTML, поэтому вам могут понадобиться разные методы обхода, но идея остается прежней (обновляйте поле всякий раз, когда изменяется количество единиц).