Multiplier la valeur du champ avec la valeur récupérée jQuery

Question

Je tire le prix du produit d'une autre page. Ensuite, je le multiplie avec la quantité entrée dans le champ de saisie. Le problème est que si j'oublie d'entrer la valeur de la quantité avant de tirer les données sur le prix du produit ou si je change le champ de quantité plus tard, le prix total final n'est pas mis à jour. J'espère que je l'ai clairement expliqué.

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

mon html:

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

• modifier

Maintenant, je suis totalement foiré. Suppression d'une ligne ne fonctionne plus aussi bien ...

Answer 1

Vous pouvez faire quelque chose comme ceci:

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

Je ne sais pas comment votre HTML est configuré de sorte que vous pourriez avoir besoin de différentes techniques de déplacement, mais le l'idée reste la même (mettre à jour le champ chaque fois que la quantité de l'unité change).

Answer 2

pour le lien de suppression, vous pouvez essayer ceci:

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

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