c# - 如何在 Asp.net MVC 中将两个文本框的值相乘

Question

我有 3 个文本框，第一个是数量，第二个是价格，第三个是总价。

 <div class="form-group">
            @Html.LabelFor(model => model.quantity, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.quantity, new { htmlAttributes = new { @class = "form-control", @type = "number" } })
                @Html.ValidationMessageFor(model => model.quantity, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.price, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.price, new { htmlAttributes = new { @class = "form-control", @type = "number" } })
                @Html.ValidationMessageFor(model => model.price, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.totalprice, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">  
                    @Html.EditorFor(model => model.totalprice, new { htmlAttributes = new { @class = "form-control", @type = "number" } })
                    @Html.ValidationMessageFor(model => model.totalprice, "", new { @class = "text-danger" })             
            </div>

这是 Controller :

        [HttpPost]
        public ActionResult Add(Model model)
        {
            obj.Quantity = model.quantity;
            obj.Price = model.price;
            obj.TotalPrice = model.totalprice

            db.Details.Add(obj);
            db.SaveChanges();
            return RedirectToAction("");
        }

现在我想将第一个和第二个文本框的值相乘并在第三个文本框中显示它们。例如，如果用户在第一个文本框中输入 5，在第二个文本框中输入 100，那么它会在第三个文本框中自动显示 500，如果用户更改第一或第二个文本框的值，那么第三个文本框的值也应相应更改。谢谢。

Answer 1

你可以在javascript中监听文本框的keyup事件，读取值并进行乘法并将结果值设置到第三个文本框。

假设您的页面中包含 jQuery 库。

$(function(){

  $("#quantity,#price").keyup(function(e){

    var q=$("#quantity").val();
    var p=$("#price").val();
    var result="";

    if(q!=="" && p!=="" && $.isNumeric(q) && $.isNumeric(p))
    {
      result = parseFloat(q)*parseFloat(p);
    }
    $("#totalPrice").val(result);

  });

});

Here是一个有效的 jsbin 示例。