3

mvcモデル検証エンジンを使用すると、HTMLヘルパーメソッドによって生成された特定のcssクラスがSite.cssからエディターに自動的に追加されます。つまり、特定のオブジェクトに対するこれらの1つ:

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

これらのスタイルを確実に編集して、必要なスタイルを適用することができます。

しかし、モデル検証エンジンに、ユーザーの要件に応じてどの正確なスタイルを使用するかを指示する機会があります。これにより、異なるフィールドを持つ1つのページを異なるスタイルにすることができますか?

編集

次のビューがあるとします。

@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.TextBoxFororなどの具体的なヘルパー メソッドには必要なオーバーロードがあります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 Third Editionで述べられているように

追加の属性も提供したい場合、テンプレート化されたヘルパーを使用してプロパティのエディターを生成することはできません。そのため、代わりに 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 に答える