Oh! Yummy!!

プログラミングとか投資のこととかご飯のこととかを書きます。

HTML5ブラウザバリデーション機能でエラーチェック

先日、Webアプリのテスト中に自分で実装していないエラー文が表示され、その原因を探すのに
HTMLソースを読んだりかなりの時間を消費してしまった。

どうやらHTML5からブラウザバリデーション機能というものが導入されたらしく、これが原因で勝手にブラウザが
サブミット時にエラーチェックを行っていたらしい。どうりでHTMLソースをみてもエラーチェック処理が書かれていない
わけだ。

ただ、この機能もうまく使えば自分でエラーチェックをする箇所を減らせすことができそうだ。
型・桁数チェックが主だったので、うまく活用したい。

気をつけなければならないし、自分がドハマリしたのは、2重サブミット防止のために、フラグをもっていて、
フラグが立っているときに再度サブミットボタンがクリックされると警告を出し、falseを返すようにしていた。
このフラグはonloadでリフレッシュされるのだが、ブラウザバリデーション機能でのエラーチェック時には、
サブミットが勝手に中止される(リフレッシュはされない)ので、2重サブミット防止用フラグが立ったままになり、一生サブミット出来なかった。

ブラウザバリデーション機能を無効化にするためには、formタグにnovalidate属性を追加してあげれば良い。

要所、要所で使い分けが必要。。。