フィールドを削除している間に入力フィールドの値を計算して別のフィールドに割り当てる方法

Question

繰り返しフィールドのグループの合計量を計算しようとしています。

これは私のマークアップ

<label for="name" class="p-label-required">Amount <span style="color: red"> (Numbers only)</span></label> 
<input type="text" id="amount" name="amount[]" placeholder="Amount" required="required" class="form-control inputChangeVal reqF" data-js-input-type="number" /><br/> 

<div class="add_another_st"></div> 
<button class="btn add_another_st_btn" style="margin-bottom: 25px;">+</button> 
<hr style="margin-top: 0;"> 
Total Amount: 
<input type="text" class="totalAmount" id="updatedTotalAmount" style="font-size: 20px; font-weight: bold; margin-bottom: 25px; border: 0;" readonly /> 

であり、これは何かがamountフィールドで発生するたびに、合計を計算するために私はjQuery ..です それは正しく合計を計算し、total amountフィールドに割り当てます。

/* calculating and updating the total amount */ 
    function updateTotal() { 
     var price = 0; 

     jQuery(".inputChangeVal").each(function() { 
      var t = parseFloat(jQuery(this).val(), 10); 
      price = price + t; 
     }); 

     var total = price.toFixed(2); 
     jQuery(".totalAmount").val(total); 
     console.log('updateTotal Runs'); 
    } 
    jQuery(document).on("change, keyup", ".inputChangeVal", updateTotal); 

は、私は量フィールドが削除されたときに再び量を計算すると、それは/仕事量フィールドが削除されるたびに、全体を更新しません。

私はこのために作成したコードは、フィールドが削除されている間、私は再び合計を更新することができますどのようにここにjs fiddle

でいるのですか？

Answer 1

wrapper要素のスライドアップ時にupdateTotal()関数を呼び出す必要があります。

jQuery(this).parent('div').slideUp(1000, function() { 
    jQuery(this).remove(); 
    x--; 
    updateTotal(); // updating total 
}); 

Working fiddle

Answer 2

jQuery(wrapper).on("click", ".remove_field", function(e) { //user click on remove text 
     debugger; 
     e.preventDefault(); 
     jQuery(this).parent('div').slideUp(1000, function() { 
       jQuery(this).remove(); 

       x--; 
     /*running again calculation 0f the total amount and while removing an amount */ 
     var price = 0; 
     jQuery(".inputChangeVal").each(function() { 
       var t = parseFloat(jQuery(this).val(), 10); 
       price = price + t; 
     }); 
     var total = price.toFixed(2); 
     jQuery(".totalAmount").val(total); 
     console.log('updateTotal Runs while removing'); 
     }); 
});