在 mvc razor 中显示电子邮件验证消息（红色）答案

【问题标题】：show email validation message( in red) in mvc razor在 mvc razor 中显示电子邮件验证消息（红色）
【发布时间】：2012-01-19 23:06:40
【问题描述】：

我刚刚开始使用 mvc razor。

我想用红色显示验证错误消息。

这是我的视图模型。

public class AViewModel
{
    [Required(ErrorMessageResourceName = "EmailAddressRequired", ErrorMessageResourceType = typeof(Resources))]
    [HomeController.EmailAddressAttribute(ErrorMessageResourceType = typeof(Resources), ErrorMessageResourceName = "EmailAddress_RegularExpression_ErrorMessage")]
    public string EmailAddress { get; set; }

    [HomeController.LocalizedDisplayNameAttribute("Password", NameResourceType = typeof(Resources))]
    [Required(ErrorMessageResourceName = "PasswordRequired", ErrorMessageResourceType = typeof(Resources))]
    [DataType(DataType.Password)]
    public string Password { get; set; }

    [HiddenInput(DisplayValue = false)]
    public Guid id { get; set; }
}

我的视图看起来像这样：

<div class="left">      

    @Html.EditorForModel()
    <br />

</div>

我的 CSS 看起来像这样：

.left { float:left; width:430px; margin:0 -480px 0 0;
       padding:0 40px 20px 0; border-right:1px solid #DDD;}

css中需要改变什么？

在视图中我使用了 @Html.EditerForViewModel()。当前以黑色显示的验证消息。有红色的吗？

【问题讨论】：

使用 CSS 设置 span 样式？看看 MVC 3 示例应用程序中登录页面的 CSS 样式。
我确实更新了我的样式表

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

【解决方案1】：

您可能忘记在您的页面中包含使用典型 ASP.NET MVC 项目生成的 css 文件。默认情况下，它被命名为 site.css。它也包含在 Views/Shared/_Layout.cshtml 中的默认布局视图中。如果您创建了一个页面但未使用该布局，则可以将其包含在您的视图中。

<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

如果您没有 css 文件，您可以手动创建一个并在其中包含以下内容

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error
{
    color: #ff0000;
}

.field-validation-valid
{
    display: none;
}

.input-validation-error
{
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors
{
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid
{
    display: none;
}

如果你不小心从当前项目中删除了它，你可以从另一个项目中复制整个 css（创建一个新项目并丢弃它）。

【讨论】：

@alice7，错误消息元素使用样式 input-validation-error。确保你的 css 中有它。

【解决方案2】：

如果您右键单击验证消息的 span 标签，您会在错误消息中找到类似 class="field-validation-error" 的内容。在您的样式表中，您可以简单地添加一个属性来使用 color:red; 设置字体颜色；并且会成功！

乔纳森

【讨论】：