如何在 ASP.MVC 中指定多行编辑器的列和行？答案

【问题标题】：How do I specify the columns and rows of a multiline Editor-For in ASP.MVC?如何在 ASP.MVC 中指定多行编辑器的列和行？
【发布时间】：2011-09-07 06:08:59
【问题描述】：

在 ASP.MVC 3 中，如何为多行 EditorFor (textarea) 指定列和行？我正在使用[UIHint("MultilineText")]，但找不到任何有关如何为文本区域添加属性的文档。

所需的 HTML：

 <textarea cols="40" rows="10"></textarea>

我的 MVC 3 模型的相关部分：

[UIHint("MultilineText")]
public string Description { get; set; }

我的 Razor cshtml 的相关部分：

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

我在查看源代码中得到了什么：

 <div class="editor-field">
     <textarea class="text-box multi-line" id="Description" name="Description"></textarea>
 </div>

如何设置行和列？

【问题讨论】：

标签： asp.net-mvc razor data-annotations

【解决方案1】：

@Html.TextArea("txtNotes", "", 4, 0, new { @class= "k-textbox", style = "width: 100%; height: 100%;" })

【讨论】：

【解决方案2】：

在 .net VB 中 - 您可以在 razor 文件中使用以下内容来控制列和行：

@Html.EditorFor(Function(model) model.generalNotes, New With {.htmlAttributes = New With {.class = "someClassIfYouWant", .rows = 5,.cols=6}})

【讨论】：

【解决方案3】：

在 mvc 5 中

              @Html.EditorFor(x => x.Address, 
              new {htmlAttributes = new {@class = "form-control", 
                   @placeholder = "Complete Address", @cols = 10, @rows = 10 } })

【讨论】：

【解决方案4】：

我相信这个也可以用更少的努力（但我在 MVC 5 中）

@Html.Description(model => model.Story, 20, 50, new { })

【讨论】：

【解决方案5】：

在 ASP.NET MVC 5 中，您可以使用 [DataType(DataType.MultilineText)] 属性。它将呈现一个 TextArea 标签。

public class MyModel
{
    [DataType(DataType.MultilineText)]
    public string MyField { get; set; }
}

然后在视图中如果你需要指定行你可以这样做：

@Html.EditorFor(model => model.MyField, new { htmlAttributes = new { rows = 10 } })

或者只使用具有正确重载的 TextAreaFor：

@Html.TextAreaFor(model => model.MyField, 10, 20, null)

【讨论】：

很高兴知道他们做出了这样的改变。 :-)
显然自 MVC 3 以来一直存在：stackoverflow.com/questions/4927003/…
感谢您提供各种解决方案。他们为我工作。

【解决方案6】：

一个选项似乎是使用 CSS 来设置文本区域的样式

.multi-line { height:5em; width:5em; }

见this entry on SO 或this one.

Amurra 接受的答案似乎暗示此类是在使用 EditorFor 时自动添加的，但您必须验证这一点。

编辑：确认，确实如此。所以是的，如果你想使用 EditorFor，使用这种 CSS 样式就可以满足你的需求。

<textarea class="text-box multi-line" id="StoreSearchCriteria_Location" name="StoreSearchCriteria.Location">

【讨论】：

感谢您回答原发帖者的问题。当使用使用 EditorFor 创建输入字段的框架时，例如 Telerik ASP.NET MVC，替换 TextAreaFor 不是一种选择。谢谢你。

【解决方案7】：

使用文本区域

@Html.TextAreaFor(model => model.Description, new { @class = "whatever-class", @cols = 80, @rows = 10 })

或使用multi-line 类的样式。

您也可以为此写EditorTemplate。

【讨论】：

对于阅读本文的任何人：@ @cols 和 @rows 是不必要的。 IE。 cols 和 rows 就足够了。