3

当我们使用 mvc 模型验证引擎时,它会自动将 Site.css 中的某些 css 类添加到编辑器中,由 HTML 辅助方法生成;即其中一个用于某些对象:

.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;
}

我们当然可以编辑这些样式以应用所需的样式。

但是有没有机会告诉模型验证引擎,根据任何用户要求使用什么确切的样式,以便我们可以拥有一个具有不同字段的页面,不同的样式?

编辑

假设我们有以下观点:

@model ModelValidation.Models.Appointment
@{
    ViewBag.Title = "Make a Booking";
}
<h2>
    Book an Appointment</h2>
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <p>
        @Html.LabelFor(m => m.ClientName, "Your name: ") @Html.EditorFor(m => m.ClientName)
        @Html.ValidationMessageFor(m => m.ClientName)
    </p>        
    <p>
        @Html.LabelFor(m => m.Date, "Appointment Date: ") @Html.EditorFor(m => m.Date)
        @Html.ValidationMessageFor(m => m.Date)
    </p>
    <p>
        @Html.EditorFor(m => m.TermsAccepted) @Html.LabelFor(m => m.TermsAccepted, "I accept the terms & conditions")
        @Html.ValidationMessageFor(m => m.TermsAccepted, null, new { @class = "other-input-validation-error" })
    </p>
    <input type="submit" value="Make Booking" />
}

通过@Html.ValidationMessageFor重载,我们可以指定 css 类来设置错误消息的样式。但是我们如何为编辑器指定 css 类呢?

4

2 回答 2

1

我确实在不耐烦地等待其他答案,但直到这就是我想出的。

Html.TextBoxFor像or等​​具体的辅助方法有必要的重载Html.PasswordFor。所以下面的例子展示了我想要的:

@using (Html.BeginForm())
{
    <p>
        @{ModelState state = ViewData.ModelState["ClientName"];            
        }
        @Html.LabelFor(m => m.ClientName, "Your name: ")
        @if (state != null && state.Errors.Count > 0)
        {
            @Html.TextBoxFor(m => m.ClientName, new { @class = "other-input-validation-error" })
        }
        else
        {
            @Html.EditorFor(m => m.ClientName)
        }
        @Html.ValidationMessageFor(m => m.ClientName)
    </p>        
}

但我仍然对如何做到这一点的任何其他想法持开放态度。一般来说,我对asp很陌生,可能很容易错过(只是不知道)该技术的一些不错的功能。

编辑

正如Sanderson S. Freeman A. - Pro ASP.NET MVC 3 Framework 第三版中所说

如果我们还想提供额外的属性,我们不能使用模板化的帮助器来为属性生成编辑器,所以我们使用了 Html.TextBoxFor 帮助器,并使用了接受匿名类型的版本来用于 HTML 属性。

于 2012-08-31T00:35:24.863 回答
0

您始终可以使用包含在该特定页面中的另一个 css 文件来覆盖您的设置。要覆盖 MVC 生成的 CSS 的设置,您可以使用这样的容器 ID

#container .mvc_css_class
{
    display: none;

}

另一种选择是使用元素名称来增加您自己的 css 的优先级,但通过指定不同的 ID 不起作用

div.mvc_css_class
{
    display: none;

}

因此,如果您想为单个页面设置不同的样式,只需包含您的 css 文件并将该页面的容器 ID 设置为不同的值,新的 css 设置将根据容器覆盖。

编辑:要选择覆盖每个页面上的样式,必须在每个页面上使用单独的设置。首先以不同的方式命名表单容器 ID

<div id="container-homepage">
    ...... the form data with original settings ..
</div>

在您的 css 文件中,使用 id 应用您想要的主页样式

#container-homepage .mv_generated_class{ 
    color : blue;
}

对您希望看起来不同的所有页面和类重复相同的操作

于 2012-08-30T07:05:31.013 回答