mise à jour des totaux de ligne sur un bon de commande avec jquery

Question

J'ai un formulaire sur une page de commande dont j'ai besoin de mettre à jour les totaux de ligne lorsque l'utilisateur change la quantité. J'ai le total général de travail, mais je ne peux pas obtenir les totaux de ligne parce que je n'arrive pas à comprendre comment cibler l'élément correct.

La forme est générée par un CMS donc finit enveloppées dans beaucoup de divs étrangers etc ... ceci est une version simplifiée de chaque élément de ligne:

 <input type="text" class="text cart_qty" id="Form_OrderForm_Product-1065-qty" name="Product[1065][qty]" value="1" /> 

     <input type="text" class="text prod_id" id="Form_OrderForm_prod_1065" name="prod_1065" value="1065" /> 

     <input class="hidden" type="hidden" id="Form_OrderForm_hidden_1065" name="hidden_1065" value="1.45" /> 

     <span id='Product_1065_Line' class='cart_price_line'>1.45</span> 

donc en gros, chaque fois que l'entrée .cart_qty le champ est modifié, .cart_price_line doit être mis à jour.

J'ai les totaux de travail comme celui-ci:

$('.cart_qty').keyup(function(){ 
var $thetotal=0; 

$('input.cart_qty').each(function(index) { 

$theqty=$(this).val(); 
$thenextindex=$("input").index(this) + 2; 
$theprice=$("input:eq("+$thenextindex+")").val(); 

$thelinetotal=$theqty * $theprice; 
$thetotal=$thetotal + $thelinetotal; 

}); 
$("#total_price_curr").html($thetotal).formatCurrency(); 
$("#Form_OrderForm_totalHidden").val($thetotal); 


}); 

Il est le calcul des éléments de ligne ok, mais je ne peux pas comprendre comment cibler la span.cart_price_line dans le $ (« input.cart_qty »). chaque (...) fonction.

Toute aide serait appréciée

Answer 1

would't ce soit this.children("span.cart_price_line")

Answer 2

Je ne suis pas sûr que je suis ce que vous avez demandé, mais peut-être cela aidera. Ajoutez ceci à la fin de la fonction .each()

var product_id = $(this).attr("id").split("-")[1]; 
$("#Product_" + product_id + "_Line").html($thelinetotal); 

Demo avec cette ligne ajouté: http://jsfiddle.net/7NCdQ/

Aussi, je réécrite (nouveau sélecteur jQuery pour obtenir les variables prix et changé de nom)

$('input.cart_qty').keyup(function(){ 
    var total = 0; 

    $('input.cart_qty').each(function(index) { 
     var product_id = $(this).attr("id").split("-")[1]; 

     var quantity = $(this).val(); 
     var price = $("#Form_OrderForm_hidden_" + product_id).val(); 

     var line_total = price * quantity; 
     total += line_total; 

     $("#Product_" + product_id + "_Line").html(line_total); 
    }); 

    $("#total_price_curr").html(total); 
    $("#Form_OrderForm_totalHidden").val(total); 
}); 

Démo: http://jsfiddle.net/7NCdQ/1/