首页 文章

如何在 mvc3 中为嵌套控件添加“input-validation-error”

提问于
浏览 次
2

我有这样一个对象：

public class Test
{
    public String TestValue { get; set; }
}

对于此对象，有一个用于模板的自定义编辑器：

@inherits System.Web.Mvc.WebViewPage<MvcApplication12.Models.TestModel>
@Html.EditorFor(m => m.TestValue)

和 Model-Binder：

public class TestBinder : IModelBinder
{
    public object BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext)
    {
        ValueProviderResult providerValue =
            bindingContext.ValueProvider.GetValue(bindingContext.ModelName + ".TestValue");
        bindingContext.ModelState.SetModelValue(bindingContext.ModelName + ".TestValue", providerValue);            

        if (null != providerValue && !String.IsNullOrWhiteSpace(providerValue.AttemptedValue))
        {
            Test test = new Test();
            test.TestValue = providerValue.AttemptedValue;
            return test;
        }

        return null;
    }
}

控制器的模型是这样的：

public class LogOnModel
{
    [Required]
    [DataType(DataType.Password)]
    [Display(Name = "Password")]
    public string Password { get; set; }

    [Required]
    [Display(Name = "Value")]
    public Test Value { get; set; }
}

您可以看到，我使用 Test 对象，它将由上面显示的模板的自定义编辑器呈现。

剃刀语法是这样的：

<div class="editor-label">
            @Html.LabelFor(m => m.Password)
        </div>
        <div class="editor-field">
            @Html.PasswordFor(m => m.Password)
            @Html.ValidationMessageFor(m => m.Password)
        </div>

        <div class="editor-label">
            @Html.LabelFor(m => m.Value)
        </div>
        <div class="editor-field">
            @Html.EditorFor(m => m.Value)
            @Html.ValidationMessageFor(m => m.Value)
        </div>

模型中的数据转换表明，测试对象(m.Value)的输入是必需的。当此字段没有输入时，ModelBinder(TestBinder)将返回 null。

然后验证消息显示如下：

网页

但是名为“input-validation-error”的 css 类未添加到输入字段中。

我怎样才能实现，在 Model-Error mvc3 上将 css 类“input-validation-error”添加到自定义编辑器模板的所有嵌套输入字段中？

asp.net-mvc-3 modelstate editorfor

1 回答

  • 1

    终于我解决了。有两种方法可以做到这一点。

    • 如果自定义编辑器中只有一个字段，则可以使用文本框，但不要**设置名称

    @inherits System.Web.Mvc.WebViewPage<MvcApplication12.Models.TestModel> @Html.TextBox("", Model.TestValue)

    • 但也许你的自定义编辑器中有多个字段。

    首先，您必须更改您的 css 文件并添加这样的一行

    .inner-input-validation-error input[type=text]

    现在，您可以说出错误字段的外观。也许是这样

    .inner-input-validation-error input[type=text],
input.input-validation-error,
textarea.input-validation-error,
select.input-validation-error
{
    border: 1px solid black;
    background-color: red;
    font-size:100%;
}

    现在更改模板的自定义编辑器，以便在包含编辑字段的范围内添加错误类.inner-input-validation-error

    @inherits System.Web.Mvc.WebViewPage<MvcApplication12.Models.TestModel>
    <span
        @if (!ViewData.ModelState.IsValid)
        {
            <text>
                class="inner-input-validation-error"
            </text>
        }
    >
    @Html.EditorFor(model => model.TestValue1)
    @Html.EditorFor(model => model.TestValue2)

</span>

    而已。

    回复于

相关问题