首页 > 解决方案 > MVC @Html.HiddenFor 呈现没有值的 html 表单

问题描述

注意,在您阅读其余内容之前

这个问题与 POST方法、使用提交的表单重新显示视图或将输入值绑定到控制器方法参数无关。它纯粹是关于使用 html 助手(HiddenForHidden - 两者返回相同的)呈现视图。


HiddenFor我使用助手创建了一个简单的隐藏字段

@Html.HiddenFor(m => m.ProductCode)

我的问题是这个隐藏字段的值被呈现为空:

<input id="productCode" name="productCode" type="hidden" value/>

即使我在实例化模型时设置它,当然也可以通过调试确认(它总是有一个值)。
因此,它应该看起来像这样:

<input id="productCode" name="productCode" type="hidden" value="8888888"/>

因为我知道有一些像这样的问题(实际上它们都指在表单 POST 期间更改表单值),所以我列出了我已经尝试过的事情。我的代码就在这部分的正下方,我认为这是必不可少的。


到目前为止,我尝试过:

@Html.HiddenFor(m => m.ProductCode)
@Html.HiddenFor(m => m.ProductCode)

部分工作产生第一个输入 asvalue/>和第二个 as value="8888888"/>,这表明可能存在隐藏初始属性值的东西。无论如何,我在任何时候都没有在 ViewData 中找到任何东西,也没有在 query string 中找到任何东西。显然我不能接受这种方式,我猜不需要解释。

还有一件事我觉得很有趣。在 Chrome [ctrl+U]中读取带有显示页面源的html显示该值是有效的,但在 DevTools 中它仍然是当然提交表单将 null 传递给 Controller 方法。value="8888888"/>value/>


模型

public class Product
    {
        public string Description { get; set; }
        public int Quantity { get; set; }
        public string ProductCode { get; set; }
        public string ImageUrl { get; set; }

        public Product(string desc, string productCode, string imgUrl)
        {
            Description = desc;
            ProductCode = productCode;
            ImageUrl = imgUrl;
        }
    }

看法

@model Product

@using (Html.BeginForm("UpdateCart", "Cart"))
{
    <div class="row pad10">

        <div class="col-sm-6 text-center">
            <img src="@Model.ImageUrl" width="300" height="300" />
        </div>
        <div class="col-sm-6 text-justify">
            <p>@Model.Description</p>
            <div class="row padding-top-2">
                <div class="col-sm-6">
                    <label>@CommonResources.Quantity: </label>
                </div>
                <div class="col-sm-4">
                    @Html.TextBoxFor(m => m.Quantity, new
                    {
                        @class = "form-control",
                        @data_val_required = CommonResources.FieldRequired,
                        @data_val_number = CommonResources.ValidationNumber
                    })
                    @Html.ValidationMessageFor(model => model.Quantity, "", new { @class = "text-danger" })
                    @Html.HiddenFor(m => m.ProductCode)
                </div>
            </div>
        </div>
    </div>
    <div class="text-center col-xs-12 padTop20 padBottom20">
        <input type="submit" value="Submit" class="whtBtn pad" />
    </div>
}

控制器

视图通过 RedirectToAction 从控制器返回,如下所示:
ValidateAndProceed -> ResolveNextStep(此处发生重定向)-> ShowProduct

        public ActionResult ValidateAndProceed()
        {
            var order = Session.Current.Order;
            var lang = LangService.GetSelectedLanguage();
            var invoice = Session.Current.CurrentInvoice;
            var localCurrency = Session.Current.LocalCurrencyInfo;

            List<CheckoutValidationFieldError> errors = new List<CheckoutValidationFieldError>();

            errors = ValidationService.ValidateAddress(order);
            if (errors.Count > 0)
            {
                return RedirectToAction("InvalidAddress", "Address", new { serializedErrors = JsonConvert.SerializeObject(errors) });
            }

            return ResolveNextStep(order, invoice);
        }

        public ActionResult ResolveNextStep(IOrder order, IInvoice invoice)
        {
            if (OrderService.ShowProductView(order, invoice))
            {
                return RedirectToAction("ShowProduct");
            }
            return RedirectToAction("Summary");
        }

        public ActionResult ShowProduct()
        {
            Product model = ProductService.GetProduct(Session.Current.CurrentInvoice);
            return View("~/Views/Product.cshtml", model );
        }

最后,什么会导致这种奇怪的行为?我已经没有选择了。也许有人以前遇到过像我这样的问题,会很感激这个案子的任何线索。

标签: c#htmlrazorasp.net-mvc-5hidden-field

解决方案


我调试了渲染视图的整个过程(进入 .Net 源代码),检查了所有可能导致它失败的地方,但什么也没找到。

在@AndyMudrak 和@Jeremy Lakeman 发表评论后,我决定再次尝试找出导致该行为的 JavaScript,但比以前更深。我发现的是一个非常愚蠢的脚本,其中元素 ID 是从三个字符串连接起来的,这是我没想到的,因为它的实现非常糟糕。所以最后 - JavaScript 正在这样做,并且框架等没有不良行为。

实际上我有点失望(即使很高兴知道这个简单的答案),因为它看起来比实际复杂得多,我花了几个小时才发现它有多简单:|

感谢您的评论,抱歉最后的简单性。


推荐阅读