添加文本框值并在jquery添加行功能的另一个文本框中显示

Question

Please check the link jsfiddle .

Every text box has seperate id.

function calculation(id)
{
 var quantity = document.getElementById("qty"+id).value;
 var unit_price = document.getElementById("unit"+id).value;
 var total_price = quantity * unit_price;
 document.getElementById('total_price'+id).value = total_price;
}

I want the sum of total price and display on the final price.

Thanks in advance

Answer 1

Remove onchange="calculation(id) " call from all inputs and put below jquery function in document.ready

$(document).delegate
('input[id^="qty"],input[id^="unit"]',
 "keyup",function()
{
   var indexVal = $(this).attr('alt');     
   $('#total_price'+indexVal).val(
        $('#qty'+indexVal).val() * $('#unit'+indexVal).val()
    );
  var finalTotalPrice = 0 ;     
   $("input[id^='total_price']").each(function(){
       finalTotalPrice = parseInt(finalTotalPrice) + parseInt($(this).val());
   });
   $("input[name='final_price']").val(finalTotalPrice); 
});

Working JSFiddle

and to show selected discount

$(document).delegate('select[class="discount"]',"change",function(){
    var discVal = $(this).val();
           $(this).parent().next().children(":nth-child(1)").val(discVal);
});

Working JSFiddle