mvc3 - 基于模型属性添加 CSS 类答案

【问题标题】：mvc3 - adding CSS class based on model attributesmvc3 - 基于模型属性添加 CSS 类
【发布时间】：2011-07-22 09:43:03
【问题描述】：

我有一个像这样的模型元素：

[Required]
[Display(Name = "First name")]
[StringLength(50)]
public string FirstName { get; set; }

我正在使用 EditorFor 将其泵出到页面，如下所示：

@Html.EditorFor(x => x.FirstName )

我在页面上有许多这样的元素，我想根据模型是否具有 [Required] 属性，向名为“Required”的输入字段添加一个 CSS 类。

正在添加...

@Html.EditorFor(x => x.FirstName, new { @class = "Required" }) )

...似乎有点手动。有没有办法让我动态地做到这一点？

提前致谢

【问题讨论】：

标签： c# asp.net-mvc-3 razor

【解决方案1】：

似乎有点手动。

最重要的是不工作。 EditorFor 助手的第二个参数并没有像你想象的那样做，这与 TextBoxFor 助手相反。您可以编写一个custom metadata provider，它允许您使用自定义属性装饰我们的视图模型属性并指定要应用于编辑器模板的类：

[Required]
[Display(Name = "First name")]
[StringLength(50)]
[HtmlProperties(CssClass = "Required")]
public string FirstName { get; set; }

【讨论】：

【解决方案2】：

如果您不需要支持最旧的浏览器，您还可以使用已自动添加到字段的data-val-required html 属性。在 CSS 中，例如 input[type="text"][data-val-required] { border-left: 2px solid blue; }。

【讨论】：

这对我有用。感谢所有的 cmets！

【解决方案3】：

我建议覆盖创建 EditorTemplate：/Views/Shared/EditorTemplates/String.cshtml

把它放在内容中（抱歉未经测试！）：

@Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new { @class = "text-box single-line" + (ViewData.ModelMetadata.IsRequired ? " required" : "") })

【讨论】：