MVC如何自动显示总金额答案

【问题标题】：MVC How to display total amount automaticallyMVC如何自动显示总金额
【发布时间】：2019-03-01 17:54:23
【问题描述】：

我试图在 MVC 中显示从 @Html.TextboxFor()s 到 @Html.DisplayFor() 的总金额，而没有总按钮或任何东西。就像在 winform textChange 中一样，但我不知道该怎么做。

 @Html.TextBoxFor(s => s.num1)
 @Html.TextBoxFor(s => s.num2)

在文本框中更改金额时，displayfor会自动显示总数

我根据 Linoy 的回答添加了这个，但 .text 似乎没有显示结果。

        $('.getNum1').blur(function () {
            var val1 = $(this).val();
            var val2 = $('.getNum2').val();

            $('.gettotal').text(parseInt(val1) + parseInt(val2));
        });

【问题讨论】：

您需要使用javascript来响应客户端事件

标签： asp.net-mvc razor

【解决方案1】：

这些是您可以尝试的步骤

step1：在两个txtboxes和label中添加类名（我们可以很容易地用jquery选择文本框）

Step2：使用jquery“onblur”事件来识别文本框的变化（在两个txtboxes中都使用onblur事件）

Step3：在事件回调里面，检查所有的文本框是否被填满。您可以使用以下查询获取文本框值 $('.txtboxclassname').val()

Step4：执行你的逻辑并将结果更新为标签

$('.labelclassname').text(yourresult)

How to change the text of a label in jQuery?

【讨论】：

谢谢 .blur 工作正常，但 step4 没有显示结果
您能控制一下结果并检查您是否正确解析了这些值。像 console.log(val1+val2)
我试过console.log，它完美地显示了答案
好的，你能试试 $('.gettotal').innerHTML =yourresult
@Amits，刚才我尝试了 $('.labelclassname').text("some text") 并且它更新正确。所以我坚信你的选择是错误的。将 $('.gettotal') 放在浏览器开发者控制台中，看看你选择的标签是否正确。

【解决方案2】：

查看此代码

 @Html.TextBoxFor(s => s.num1, new { @class = "prop" })
     @Html.TextBoxFor(s => s.num2, new { @class = "prop" })

    <span class="gettotal"></span>

         $(".prop").on("input", function (e) {
                           // debugger;
                            var total = 0;
                            $('input[class*="prop"').each(function () {
                                var rowval = $(this).val();
                                total = total + parseInt(rowval);
                            });
                            $('.gettotal').text(total);
                        });

【讨论】：