如何以MVC Razor形式显示计算字段？

Question

从MVC4和Razor表单开始，但在提交表单之前，无法在表单中显示计算的字段。

说，为简单起见，我们有可编辑文本框的字段价格和数量，以及显示计算的总价格*数量的第三个只读文本框。

这个post suggests使用我们新奇的Razor很方便，但是当我们尝试以下时，表格中没有任何动态变化：

@{
   var value = model.Item.Value;
   var price = model.Item.Proce;
   var calculated = value * price;
}

<div class="price">Your price: @calculated</div>

Answer 1

如果您希望在用户输入时或在提交表单之前实时，您将不得不使用javascript;服务器端剃刀代码是不够的。剃刀代码仅在首次呈现页面时执行。

您有几个选择：

1. 当用户完成输入时，通过ajax将数据发送到服务器 得到一个计算总数。获取响应并将其显示在 页
2. 只需在客户端上以用户身份完全更新计算 类型（您可以使用MVVM框架来帮助解决此问题（例如     Knockout.js））

修改

添加一些示例链接：

以下是＃1：Making a Simple Ajax call to controller in asp.net mvc

的示例

以下是如何实现＃2：http://knockoutjs.com/examples/cartEditor.html

的示例

就我个人而言，我会在客户端（＃2）上进行计算，然后只进行验证服务器端，因为这是重要的。