jquery를 사용하여 N 개의 입력 값 계산

Question

사용자는 여러 제품 정보를 추가하기 위해 jquery- new row를 사용하여 무제한의 행을 작성할 수있는 양식을 가지고 있습니다. 새로운 행을 만들면 코드는 다음과 같이 보입니다. 모든 시간은 사용자가 제품 수량과 나는 즉시 총 (product quantity* product price)을 계산하고 total[] 입력에 결과를 넣고있는 total amount 입력을 조정하려는 제품 가격의 가치를두고 때

지금 내가 뭘하려고하다 폼의 맨 아래에.

jquery를 사용하여 고정 된 양의 입력을 가지고있을 때이 작업을 수행하는 방법을 알고 있지만이 상황에서 입력 양이 고정되어 있지 않으므로이를 달성하는 방법에 대한 아이디어가 있습니다.

표시해주세요. 사전에

감사합니다 :)

<tr> 

    <td><input type="text" name="name[]" id="name_1" value=""></td> 
    <td><input type="text" name="quantity[]" id="quantity_1" value=""></td> 
    <td><input type="text" name="rate[]" id="rate_1" value=""></td> 
    <td><input type="text" name="total[]" id="total_1" value=""></td>       

</tr> 

<tr> 

    <td><input type="text" name="name[]" id="name_2" value=""></td> 
    <td><input type="text" name="quantity[]" id="quantity_2" value=""></td> 
    <td><input type="text" name="rate[]" id="rate_2" value=""></td> 
    <td><input type="text" name="total[]" id="total_2" value=""></td>      

</tr> 

    <!-- I have N number of rows like above. and at the bottom I have input for total --> 
<tr> 

    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    <td><input type="text" name="totalamount" id="totalamount" value=""></td>       

    </tr>       

Answer 1

여기에 하나 개의 가능한 솔루션입니다 :

$(":text[name='quantity[]'], :text[name='rate[]']").on("change", function() { 
    var totalamount = 0; 
    $("tr").each(function() { 
     var quantity = +$(this).find(":text[name='quantity[]']").val() || 0; 
     var rate = +$(this).find(":text[name='rate[]']").val() || 0; 
     var subtotal = quantity * rate; 
     $(this).find(":text[name='total[]']").val(subtotal); 
     totalamount += subtotal; 
    }); 
    $("#totalamount").val(totalamount); 
});​ 

DEMO :http://jsfiddle.net/ak49E/