MVC計算フィールドHtml.TextBoxFor Javascriptと2つの関数の競合

Question

ユーザーが入力する際に​​計算したいフィールドがいくつかあるフォーム/ Webページに次のフィールドがあります。フィールド単位原価がケースコスト/ケースサイズで計算される

Fields - image here

（画像を参照）。私は、次のコード

Casesizeテキストボックス

@Html.TextBoxFor(model => model.q_supplierproduct.q_casesize, "{0:#.#}", new { @class = "calc" }) 

ケースコストのテキストボックス

@Html.TextBoxFor(model => model.q_supplierproduct.q_casecost, "{0:#.#}", new { @class="calc"}) 

単位コストのTextbox

@Html.TextBoxFor(model=> model.q_unitcost, "{0:#.#}", new { @class = "calc" }) 

機能

と完全に機能していることを持っています

コントローラ

public class CalculateValuesController : Controller 
{ 
    [HttpPost] 
    public JsonResult CalculateUnitCost(double Q_casecost, double Q_casesize) 
    { 
     var result = Computation.GetUnitCost(Q_casecost, Q_casesize); 
     return Json(result.ToString("#.#")); 
    } 

方法

public class Computation 
{ 
    public static double GetUnitCost(double Q_casecost, double Q_casesize) 
    { 
     double unitcostresult = Q_casecost/Q_casesize; 
     return unitcostresult; 
    } 

だけで再び言及する予想通り、私はそれに応じてcasesiezとcasecostの値、unitcostフィールドの更新を変更した場合、このコードは、動作します。私が達成したいと思った次のことは、価格フィールドから単価フィールド（前に計算されたフィールド）を引いた値に基づいて利益フィールドを計算することでした。私はこれを添加して以降この点から、そのフィールドの2番目のスクリプトに加えて、コントローラ内の各計算と方法

See two scripts image

<script> 
    var url = '@Url.Action("CalculateProfit", "CalculateValues")'; 
    $('.calc').change(function() { 
     //get the values of the texboxes 
     var sellprice = $('#q_sellprice').val(); 
     var unitcost = $('#q_unitcost').val(); 
     //check if field entries are valid 
     if (sellprice == '' || unitcost == '' || isNaN(sellprice) || isNaN(unitcost)) { return; } 

     $.post(url, { Q_sellprice: sellprice, Q_unitcost: unitcost }, function (response) { 
      $('#q_profit').val(response); 
     }); 
    }); 

を加えるようになった、単価フィールドは、（作業停止しますデータが入力されても更新はありません）、単位コストと価格フィールドに値を入力すれば、利益領域がそれに応じて計算されます。 （新しいスクリプトは、最初のスクリプトが目的どおりに機能しなくなる）。私はここで何が欠けていますか？ 両方のスクリプトで共通の単価のフィールドが原因で問題になっていますか？どうすれば修正できますか？

Answer 1

StephenとTetsuyaのコメントを読んだところ、次のようにコードが変更され、問題が解決しました。 unitcostとprofitの2つのフィールドは、それぞれの変更されたフィールドに基づいて更新されています。私はここでアクションメソッドを呼び出すことはありません、私はアドバイスとしてjavascriptですべての計算をしています。

<script> 
    function calculate() 
    { 
     //Fields that are used for calculations 
     var casecost = parseFloat($('#q_supplierproduct_q_casecost').val()); 
     var casesize = parseFloat($('#q_supplierproduct_q_casesize').val()); 
     var price = parseFloat($('#q_sellprice').val()); 

     //Calculations 
     var unitcost = casecost/casesize; // get unitcost from casecost FIELD and casesize FIELD 
     var profit = price - unitcost; // get profit from price FIELD and unicost CALCULATED value 

     //set results to the updating fields 
     $('#q_unitcost').val(unitcost.toFixed(2)); 
     $('#q_profit').val(profit.toFixed(2)); 
    } 

    $(document).ready(function() { 
     //calculate(); 
     //calculate everytime these following fields change 
     $('#q_supplierproduct_q_casecost').change(calculate); 
     $('#q_supplierproduct_q_casesize').change(calculate); 
     $('#q_sellprice').change(calculate); 
     $(unitcost).change(calculate); 
    }); 
</script> 

これは、他の誰かが道を去るのを助けることを望みます。