使用JavaScript计算@ HTML.TextBoxFor(MVC)中的值

时间:2015-01-09 09:24:45

标签: javascript html asp.net-mvc

我有四个@ Html.TextBoxFor,代码如下所示

@Html.TextBoxFor(model => model.money, "money", new { @class = "required numeric", id = "money", Value = String.Format("{0:C}", Model.money )})

@Html.TextBoxFor(model => model.money2, "money2", new { @class = "required numeric", id = "money2", Value = String.Format("{0:C}", Model.money2 )})

@Html.TextBoxFor(model => model.money3, "money3", new { @class = "required numeric", id = "money3", Value = String.Format("{0:C}", Model.money3 )})

@Html.TextBoxFor(model => model.TotalMoney, "TotalMoney", new { @class = "required numeric", id = "TotalMoney", Value = String.Format("{0:C}", Model.TotalMoney )})

我以前用了四个

<input type="text" id="money" onkeyup="sum();" name="money" value="@Model.money" />

为了将钱,钱2和钱3一起添加到TotalMoney中产生结果但是它给了我一个小数问题,如果我使用TextBoxFor我没有得到小数问题但是我放松了计算功能。

我正在使用的JavaScript代码是

<script type="text/javascript">

        function sum() {
            var txtFirstNumberValue = document.getElementById('money').value;
            var txtSecondNumberValue = document.getElementById('money2').value;
            var txtThirdNumberValue = document.getElementById('money3').value;
            var result = parseFloat(txtFirstNumberValue) + parseFloat(txtSecondNumberValue) + parseFloat(txtThirdNumberValue);
            if (!isNaN(result)) {
                document.getElementById('TotalMoney').value = result.toFixed(2);
            }
        }
    </script>

JS在输入方面效果很好,但在TextBoxFor中根本无法工作,我怎样才能将JS改编成TextBoxFor?

1 个答案:

答案 0 :(得分:0)

我必须适应斯蒂芬的工作答案,因为我也需要它。斯蒂芬的回答如下所示,因为它允许我的值显示为例如15.15英镑,因此删除了2位小数。然而唯一的问题是我仍然失去了添加钱,钱2和钱3的功能,以便在TotalMoney中自动产生总额。

@Html.TextBoxFor(m => m.money, "{0:C}", new { @class = "required numeric" })

我对斯蒂芬的代码所做的微小改动如下所示。这删除了£符号,但它也确保我的值保留2位小数(即13.12英镑)并允许我的计算功能再次工作。

@Html.TextBoxFor(model => model.money, "{0:0.00}", new { @class = "required numeric", onkeyup = "sum()" })