質問: 自分が作っている業務アプリは、画面上部にメッセージを表示する専用のエリアがあります。 入力エラーはここに表示されます。 !画像の説明をここに入力 そこで質問です 1. webシステムではテキストボックスの隣にエラーを表示するのが一般的なのでしょうか 2. テキストボックスの隣にエラーを表示した場合、ブラウザ上でレイアウトがずれませんか 3. javaで業務システムを作りたいのですが、入力チェックは何で実装するのがベストですか? → 専用エリアに入力エラーを表示する場合は、 TABインデックス順にエラーを表示したいなと思いました。
回答: 一応Webシステム(業務)をメインにしてる経験上。 1. バリデーションメッセージ表示のパターンで多いのは2つ。 1. フォームの最上部に入力項目分すべてをまとめて出す 2. 各入力項目の右、もしくは直下に出すスマホやタブレットを対象にするなら 2 のパターンにします(スクロール操作は避ける意味で) 2. リセットCSSを噛ませるのは当たり前ですが、使う端末によって変えるべきです 用途がタブレットを視野に入れるなら直下の方が無難でしょう。業務上、デスクトップで解像度も指定されているなら横でも下でも見やすい方に出すべきです。 フォーム最上部にまとめて出すパターンなら li 列挙でしょうから悩まないですね。 3. 入力チェックは理想「クライアントJavascript + サーバサイド入力チェック」現実解「フレームワークでサポートしているサーバサイド入力チェック」。 HTML5 なら、その仕様上のバリデーション()も可能ですが、業務利用だと面倒なことに IE9 縛りがあるかもしれません。その場合、クライアントサイドはまだ JavaScript を使う必要があります。 サーバサイドのチェックは、DBに異常値が入らないための設定です。攻撃対策であると考えて下さい。 重要度は サーバサイド > クライアントサイド です 1, 2 共通で、バリデーションエラー項目は赤着色位する場合が多いです。 3 は、昨今の Java フレームワークなら入力バリデーション位存在しているでしょうから、それを用いるのが一番よいかと懐います。 ただし、タブインデックスということであれば、クライアントサイドでの実装が必要だと思われます。 大抵のJavaScriptバリデーションライブラリは、入力アイテムの右か直下に置くので、画面上部にまとめて出す場合は自作したほうが早いかもしれませんね。