2

私はこのようなオブジェクトを持っています:

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

このオブジェクトには、テンプレート用のカスタムエディタがあります。

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

およびモデルバインダー:

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クラスは入力フィールドに追加されません。

モデルエラーでmvc3がカスタムエディターテンプレートのすべてのネストされた入力フィールドにcssクラス「input-validation-error」を追加することをどのように達成できますか?

4

1 に答える 1

1

ついに解決しました。それを行うには2つの方法があります。

  1. カスタムエディタにフィールドが1つしかない場合は、名前を設定しないテキストボックスを使用できます

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

  1. ただし、カスタムエディタに複数のフィールドがある場合があります。

まず、cssファイルを変更し、次のように1行追加する必要があります

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

それでおしまい。

于 2012-09-28T12:57:52.697 に答える