.innerhtmlすぐ値をudpatingしない

Question

私はこれらの2つの関数を使用していますが、最初の関数ではinnerhtmlの値を更新し、2番目の関数ではサブを再計算するために '新しい'合計。

ただし、2番目の関数で変更されたinnerhtmlを使用すると、古い値が使用されています。最初の関数のinnerhtmlがすぐに更新されないようです。私はすぐに更新するためにsetTimeout（）を使ってみましたが、うまくいきませんでした。

<script type="text/javascript"> 
    function refreshTotal(ProductId) { 
     var qty = document.getElementById("product-quantity-" + ProductId).value; 
     var UnitPrice = document.getElementById("unit-price-" + ProductId).innerText; 
     var total = qty * UnitPrice; 
     $.get('@Url.Action("getItemPositionCart","Home")' , {id: ProductId}, function(data) //data - holds the data returned by the action 
     { 
      document.getElementById("product-total-" + data).innerHTML = "$" + total.toFixed(2); 
      setTimeout(performExpensiveCalculationsAndRender(), 0); 
     }); 

     $.post('@Url.Action("EditQuantity", "Home")', { id: ProductId, quantity: qty }, function (data) { 

     }) 

     updateTotal.call(); 
    } 

    function updateTotal() 
    { 
     var grandTotal = 0; 
     var totalItems = @ViewBag.Count; 

     for(var counter = 0; counter < totalItems ; counter++) 
     { 
      var str = $("[id*=product-total-" + (counter+1)).html(); 
      var res = parseFloat(str.substring(1,str.length)); 
      alert(res); 
      //alert($("[id*=product-total-" + (counter+1)).html()); 
      grandTotal = grandTotal + res;//parseFloat($("[id*=product-total-" + counter).html()); 
      alert(grandTotal); 
     }; 
     $("[id*=sub-total]").html("$" + grandTotal.toFixed(2)); 
    } 

</script> 

.innerhtmlの値は、2番目の機能を終了すると更新されます。

Answer 1

関数の最後ではなく、コールバック内からupdateTotalに電話する必要があります。この関数はAJAXリクエストを開始します。コールバックが実行される前にupdateTotalを呼び出すと、更新する新しい合計が存在しないことを意味し、コールバックは合計を更新せずに発生します。新しいデータが受信された後にupdateTotalが呼び出されると、その新しいデータに作用します。

function refreshTotal(ProductId) { 
    var qty = document.getElementById("product-quantity-" + ProductId).value; 
    var UnitPrice = document.getElementById("unit-price-" + ProductId).innerText; 
    var total = qty * UnitPrice; 
    $.get('@Url.Action("getItemPositionCart","Home")' , {id: ProductId}, function(data) //data - holds the data returned by the action 
    { 
     document.getElementById("product-total-" + data).innerHTML = "$" + total.toFixed(2); 
     updateTotal(); // moved from end of refreshTotal 
     setTimeout(performExpensiveCalculationsAndRender(), 0); 
    }); 

    $.post('@Url.Action("EditQuantity", "Home")', { id: ProductId, quantity: qty }, function (data) { 

     updateTotal(); // may need to be included here depending on the action 
    }) 

}