Parsleyを使ったバリデーション覚え書きメモ
Parsleyを使ったバリデーションフォームは軽量で設定もシンプルなので、リアルタイムチェックでいつもお世話になっているJS。
HTMLにデータ属性をつけての起動ができ、またエラーメッセージもカスタマイズができて便利。
いままではformタグに
data-parsley-trigger="keyup focusout change input"を記述して起動していたが、今回2つのフォームを1HTMLに設置するケースがでたのと、datepicker.jsで日付選択を設置したinput要素にも「必須」としてチェックをかけた場合、datepickerで日付選択してもエラー表示が残ったままという現象が発生した。
そこでネットで検索したら、個別にチェックのタイミング設定もできることがわかって、この「input」要素だけdata-parsley-trigger="change"を直接設定。
更に2つのフォームにそれぞれ記述していたエラーチェックの起動タイミングをやめて、Parsley.options.trigger = "keyup focusout change input";を記述することでうまくエラーのタイミングの調整ができた。
複数フォームのエラーチェックの設定は以下のサイトの情報を参考にさせて頂いた。
https://qiita.com/_-_-_/items/74372058087b965764ba
ありがとうございます!