C#帮助台应用中@Html.TextBoxFor添加readonly=true属性报错求助

嘿，我碰到过好多次这个问题啦——当你给TextBoxFor加上readonly=true之后，表单提交时这个字段的值就没法传到后台了，对吧？这其实是HTML的默认行为：浏览器不会提交带有readonly属性的表单控件的值。给你几个靠谱的解决方案，挑适合你的来用：

方案1：用隐藏字段配合只读显示控件 #

这个方法最稳妥，既保证值能正常提交，又不让用户修改显示的内容。核心思路是用HiddenFor来负责传递值，同时用一个只读的文本框或者普通标签来展示用户信息：

<div class="form-group">
    @Html.LabelFor(model => model.RaisedBy, htmlAttributes: new { @class = "control-label col-md-2"})
    <div class="col-md-10 ">
        <!-- 隐藏字段负责提交值到后台 -->
        @Html.HiddenFor(model => model.RaisedBy, new { @Value = User.Identity.Name.ToString() })
        <!-- 只读文本框用来展示，用户没法修改 -->
        @Html.TextBox("RaisedByDisplay", User.Identity.Name.ToString(), new { @class = "form-control", @readonly = true })
        <!-- 也可以用更简洁的span标签：<span class="form-control">@User.Identity.Name</span> -->
    </div>
</div>

方案2：禁用控件+后台手动赋值 #

如果不想加额外的控件，你可以用disabled属性让文本框不可编辑，然后在后台的Action里手动给模型的RaisedBy字段赋值，不要依赖表单提交的值：

前端代码 #

<div class="form-group">
    @Html.LabelFor(model => model.RaisedBy, htmlAttributes: new { @class = "control-label col-md-2"})
    <div class="col-md-10 ">
        @Html.TextBoxFor(model => model.RaisedBy, new { @Value = User.Identity.Name.ToString(), @disabled = true, @class = "form-control" })
    </div>
</div>

后台Action示例 #

[HttpPost]
public ActionResult Create(YourTicketModel model)
{
    // 手动从当前登录用户获取值，覆盖表单提交的空值
    model.RaisedBy = User.Identity.Name;
    
    // 后续验证和保存逻辑
    if (ModelState.IsValid)
    {
        db.Tickets.Add(model);
        db.SaveChanges();
        return RedirectToAction("Index");
    }
    
    return View(model);
}

这个方法的好处是前端结构简单，但要记得后台必须手动赋值，不然模型里的RaisedBy会是空的。

方案3：用JS强制提交只读控件的值（不推荐） #

这个方法是应急用的，通过JavaScript在表单提交前移除readonly属性，让浏览器能提交值。不过要注意，用户可以通过浏览器控制台修改JS或者直接修改控件值，有安全风险，所以不太推荐：

前端代码 #

<div class="form-group">
    @Html.LabelFor(model => model.RaisedBy, htmlAttributes: new { @class = "control-label col-md-2"})
    <div class="col-md-10 ">
        @Html.TextBoxFor(model => model.RaisedBy, new { @Value = User.Identity.Name.ToString(), @readonly = true, @class = "form-control" })
    </div>
</div>

JavaScript代码（放在页面底部或脚本块） #

$('form').submit(function() {
    // 提交前移除readonly属性，让浏览器提交值
    $('#RaisedBy').removeAttr('readonly');
});

内容的提问来源于stack exchange，提问作者Michael