formのサブミット前にvalidationとかする方法
HTMLのformをサブミットする際に、クライアント側で必須項目の入力チェックとかつまりvalidationをしたいんだけど勝手にサブミットされてしまい困ってる、という人の参考になれば。
ボタンではなくjavascriptのsubmit()でサブミットさせる
まずボタンのtypeをsubmitではなくbuttonにします。次にjavascriptの関数を用意します。validation合格だった場合だけformエレメントのsubmit()を行なうように実装しましょう。あとはボタンのonclick属性で先の関数を指定すればできあがり。
実際のコードはこちら。