4

ViewModel のフィールドに配置された属性に対して、MVC4 フィールドのクライアント側、javascript または jQuery 主導の検証を処理するための最良の方法を知りたいです。

まず、例を挙げてみましょう。アプリケーションの初回起動時に表示される管理者用のログイン作成画面 (サイト所有者に「初回ログインとして admin/admin を使用してください」とは言わないでください)。

ビューモデル:

public class AdministratorViewModel : AbstractViewModel
{
    [Required]
    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblUsername")]
    public string Username { get; set; }

    [Required]
    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblEmailAddress")]
    [EmailAddress]
    public string EmailAddress { get; set; }

    [Required]
    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblPassword")]
    [AdminPassword]
    public string Password { get; set; }

    [Required]
    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblPasswordConfirm")]
    [Compare("Password")]
    public string PasswordConfirm { get; set; }

    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblLastLogin")]
    public DateTime? LastLogin { get; set; }

    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblPasswordExpiry")]
    public DateTime? PasswordExpiry { get; set; }

    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblBlocked")]
    public bool Blocked { get; set; }
}

部分的なビュー (最初の管理者を作成するときに必要なフィールドはわずかです)

@using (Html.BeginForm())
{
    @Html.ValidationSummary(false)
    @Html.AntiForgeryToken()

    <fieldset>
        <legend>@ManageAdminsViewResources.legendCreateAdmin</legend>

        <div class="desktoptile">
            @Html.LabelFor(m=>m.Username)
            @Html.EditorFor(m => m.Username)
            @Html.ValidationMessageFor(m => m.Username)
        </div>

        <div class="desktoptile">
            @Html.LabelFor(m=>m.Password)
            @Html.PasswordFor(m => m.Password)
            @Html.ValidationMessageFor(m => m.Password)
        </div>

        <div class="desktoptile">
            @Html.LabelFor(m=>m.PasswordConfirm)
            @Html.PasswordFor(m => m.PasswordConfirm)
            @Html.ValidationMessageFor(m => m.PasswordConfirm)
        </div>

        <div class="desktoptile">
            @Html.LabelFor(m=>m.EmailAddress)
            @Html.EditorFor(m => m.EmailAddress)
            @Html.ValidationMessageFor(m => m.EmailAddress)
        </div>

        <input type="submit" value="@ManageAdminsViewResources.btnCreate"/>
    </fieldset>
}

コントローラ

    [AllowAnonymous]
    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult CreateFirst(AdministratorViewModel viewModel)
    {
        if (!ModelState.IsValid) return View(viewModel);
        [...................]

現在

無効な電子メール アドレスや空のパスワードなどをフォームに入力して [送信] をクリックすると、エラーが正しく通知されますでは、続けましょう

私が欲しいもの

私は Metro スタイルのデザインを行っているので、ユーザーがフォーカスを外すたびに、そのフィールドのテキスト ボックスの検証が発生するようにしたいと考えています。

ハードコーディングされた jQuery フラグメントを記述することは、最良の選択肢ではありません。現在学習しているMVC4に組み込まれている可能性がある、データ駆動型のアプローチが必要です。

したがって、標準属性とカスタム属性を持つ ViewModel が与えられた場合 (そのためには、少し Javascript が必要ですが、Org.Zighinetto.AdminPasswordAttributeパスワードの複雑さをチェックすることを考えてください)、クライアントを指定せずに、最も目立たない方法でクライアント側の検証を強制するにはすべてのhtmlタグにサイドタグを付けて、最小限のコードを書いていますか?

ASP.NET MVC 4 の検証には、再表示しなければならない秘密がまだありますか?

4

2 に答える 2

2

私の(学習)観点からは、正しい答えは次のようになります。

説明:

jQuery Unobtrustive Validator がページに読み込まれると、MVC4 によって共通属性の検証が自動的に行われます。それ以外の場合は、サーバー側の検証のみが実行されます。

すべてではないにしても、ほとんどの MVC4ValidationAttributeが実装してIClientValidationいます。このインターフェイスは、jQuery Validator 検証関数をサーバー側コードでラップします。それがどのように機能するかを正確に説明するのは難しいですが、このインターフェースがクライアント側の関数 (jQuery ディストリビューションによって提供されるか、ユーザーによって実装される) の名前を返すと言うことは、基本的に間違っている一方で、少なくとも理解しようとしている初心者ユーザーにアイデアを与えます。検証の仕組み。

答え:

データ駆動型のモデル/ビューモデル アノテーションを引き続き使用します。NuGet パッケージ jQuery Unobtrusive Validation がページに読み込まれているかどうかを確認し、必要に応じて実装IClientValidationします (複数のエラーに関するチュートリアルを見つけました)。フィールドは自動的に検証されます。

于 2013-03-28T22:25:18.653 に答える
2

まあ、jQueryを使用してjQuery検証を呼び出す必要があります(jQueryで書かれているため:)

入力にグローバル イベントを追加し、ぼかした要素でそれを呼び出すことができます。何かのようなもの:

$("input").blur(function () {
    $(this).valid();
});
于 2013-03-28T22:05:45.340 に答える