LoginSignup
3
2

More than 5 years have passed since last update.

ASP.NET Core で追加されるjQuery Validation UnobtrusiveのInvalidハック

Posted at

ASP.NET Coreで新規作成した時に自動生成されるJSのValidationにて、ちょっと躓いたのでメモ。
答えはここにあった。
jQuery.Validation.Unobtrusiveのsuccess, errorをhandleする方法 #aspnetjp

やりたかったこと

クライアントサイドのJS検証がInvalidだった時にScrollTopするアニメーションを実現したかった。
(縦に長い入力Formで、標準のasp-validation-summaryが一番上にあった場合に、どこでエラーが起きたか分からん!と言われた)

結論から

以下のコード

$.validator.unobtrusive.options = { 
    invalidHandler: function () { 
        //やりたい処理
        //$("html,body").animate({ scrollTop: 0 }, 'normal');
    } 
};

    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}

より先に記述。

つまづきポイント

ASP.NET Core × jQuery Validationでエラーを表示する
この記事ではshowErrorsをハックしており、アニメーション処理は実現できました。
がなんか挙動がバギーで、エラーが発生している項目をBlurした際にもアニメーションしてしまったので採用見送り。
またvalidator.settings.invalidHandler = ほにゃららと記述した場合そもそも動作しませんでした。

以上!誰かの助けになれば!

3
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
2