127

如何使用 Razor 视图引擎在 ASP.NET MVC3 中创建只读文本框？

是否有可用的 HTMLHelper 方法来做到这一点？

像下面这样的东西？

@Html.ReadOnlyTextBoxFor(m => m.userCode)
4

7 回答 7

260 
@Html.TextBoxFor(m => m.userCode, new { @readonly="readonly" })

欢迎您为此创建一个 HTML Helper，但这只是一个 HTML 属性，就像任何其他属性一样。您会为具有其他属性的文本框制作 HTML 助手吗？

于 2012-01-06T17:15:18.960 回答
34

更新： 现在将 HTML 属性添加到默认编辑器模板非常简单。它不需要这样做：

@Html.TextBoxFor(m => m.userCode, new { @readonly="readonly" })

你可以这样做：

@Html.EditorFor(m => m.userCode, new { htmlAttributes = new { @readonly="readonly" } })

好处：您不必.TextBoxFor为模板调用等。只要打电话.EditorFor。

虽然@Shark 的解决方案工作正常，而且它简单实用，但我的解决方案（我一直使用的）是这个：创建一个editor-template可以处理readonly属性的解决方案：

  1. 创建一个名为的文件EditorTemplates夹~/Views/Shared/
  2. 创建一个PartialView名为String.cshtml

  3. 填写String.cshtml以下代码：

    @if(ViewData.ModelMetadata.IsReadOnly) {
    @Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue,
        new { @class = "text-box single-line readonly", @readonly = "readonly", disabled = "disabled" })
} else {
    @Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue,
        new { @class = "text-box single-line" })
}

  4. 在模型类中，将[ReadOnly(true)]属性放在您想要的属性上readonly。

例如，

public class Model {
    // [your-annotations-here]
    public string EditablePropertyExample { get; set; }

    // [your-annotations-here]
    [ReadOnly(true)]
    public string ReadOnlyPropertyExample { get; set; }
}

现在您可以简单地使用 Razor 的默认语法：

@Html.EditorFor(m => m.EditablePropertyExample)
@Html.EditorFor(m => m.ReadOnlyPropertyExample)

第一个呈现text-box像这样的法线：

<input class="text-box single-line" id="field-id" name="field-name" />

第二个将渲染为；

<input readonly="readonly" disabled="disabled" class="text-box single-line readonly" id="field-id" name="field-name" />

您可以将此解决方案用于任何类型的数据（DateTime、DateTimeOffset、DataType.Text等DataType.MultilineText）。只需创建一个editor-template.

于 2012-07-28T16:17:16.197 回答
5

使用 TextBoxFor 的解决方案是可以的，但是如果您不想看到像 EditBox 这样时尚的字段（这对用户来说可能有点混乱），则需要进行如下更改：

  1. 更改前的剃须刀代码

    <div class="editor-field">
     @Html.EditorFor(model => model.Text)
     @Html.ValidationMessageFor(model => model.Text)
</div>

  2. 更改后

    <!-- New div display-field (after div editor-label) -->
<div class="display-field">
    @Html.DisplayFor(model => model.Text)
</div>

<div class="editor-field">
    <!-- change to HiddenFor in existing div editor-field -->
    @Html.HiddenFor(model => model.Text)
    @Html.ValidationMessageFor(model => model.Text)
</div>

通常，此解决方案会阻止字段编辑，但会显示其价值。无需进行代码隐藏修改。

于 2012-11-27T15:37:21.690 回答
3

归功于@Bronek 和@Shimmy 之前的回答：

这就像我在 ASP.NET Core 中做了同样的事情：

<input asp-for="DisabledField" disabled="disabled" />
<input asp-for="DisabledField" class="hidden" />

第一个输入是只读的，第二个将值传递给控制器​​并隐藏。我希望它对使用 ASP.NET Core 的人有用。

于 2016-06-08T08:07:06.563 回答
0 
 @Html.TextBox("Receivers", Model, new { @class = "form-control", style = "width: 300px", @readonly = "readonly" })
于 2016-09-28T12:55:40.927 回答
0 
@Html.TextBoxFor(model => model.IsActive, new { readonly= "readonly" })

这对于文本框来说很好。但是，如果您尝试这样做，checkbox那么如果您正在使用它，请尝试使用它：

@Html.CheckBoxFor(model => model.IsActive, new { onclick = "return false" })

但不要使用disable，因为 disable 总是将默认值发送false到服务器 - 无论是处于选中状态还是未选中状态。并且readonly不适用于复选框和radio button。readonly仅适用于text字段。

于 2017-10-04T08:35:38.560 回答
0

您可以使用以下代码将 TextBox 创建为只读。

方法一

 @Html.TextBoxFor(model => model.Fields[i].TheField, new { @readonly = true })

方法二

@Html.TextBoxFor(model => model.Fields[i].TheField, new { htmlAttributes = new {disabled = "disabled"}})
于 2018-04-03T06:47:07.237 回答