前回は全般に関する説明でしたが、今回は入力画面に絞って説明していきます。
入力画面を作る際は、テーブルセルの中にフォームオブジェクト(やなど)を配置します。
入力データの種類に合わせて、次のように使い分けましょう。
選択肢から選ぶデータ
- ■ 選択肢3個以下、複数選択不可、10桁以下
- ラジオボタン
- ■ 複数選択可、10桁以下
- チェックボックス
- ■ 選択肢4個以上50個以下(都道府県くらいが限度)
- プルダウンメニュー
- ■ 選択肢51個以上
- 参照画面をポップアップで表示
手入力
- ■ 郵便番号
- テキストボックス1つで、999-9999の書式+住所検索ボタン
例)
郵便番号から住所を自動表示するのは、不特定多数の入力を想定しています。 例)入力者が消費者の場合など - ■ 都道府県
- プルダウンメニュー
- ■ 住所1
- 郵便番号を元に検索し、候補が複数の場合、プルダウン。それ以外はテキストボックスに表示。
- ■ 住所2
- テキストボックス
- ■ 年月日
- 「YYYYMMDD」でも「YYYY/MM/DD」でも両方OKとします。表示は、YYYY/MM/DDで統一。
テキストボックスのサイズ(横幅)はHTMLで指定するのではなく、入力項目ごとにスタイルシートのwidthで指定します。
頻出項目についてはスタイルシートのクラスを作成し、各テキストボックスに指定します。
- ■ 削除
- 削除ボタンがクリックされたら、必ずJavaScriptで確認ダイアログを表示します。
[ 第3回 明細画面のTips ]へ続きます……。