■ はじめに ...
このページでは、フィールドの数が多いですが、 簡易モバイル表示では
type="text"関連(サンプル1)とそれ以外(サンプル2)として分けています。
通常このような設定はしないと言う箇所もあり又、
モバイルでの表示ではフィールド等が小さくなり 操作しずらい面もありますが
あくまでもエラー表示確認のサンプルとしてご参考にして下さい。
■ このフォームでの JS 設定内容
・ 入力エラー 吹き出し(ポップアップ)表示設定 => 3秒間の表示設定
吹き出しメッセージでの項目名 => 付加表示設定
( フィールドエラーカラー設定、 フィールドエラーカラーの有無設定可
又は、吹き出しの有無にてフィールドエラーカラーのみの設定も可)
・ お名前:入力条件設定 [ z (全角チェック) ]
・ お名前(カナ):入力条件設定 [ hk (かな->カナ変換) k (全角カナチェック) ]
・ 郵便番号:入力条件設定 [ zh (全->半変換) y (3桁-4桁チェック) ]
・ ※ お名前(カナ)、郵便番号:エラーカラー個別設定
・ 電話番号:入力条件設定 [ zh (全->半変換) t (2〜5桁-1〜4桁-4桁チェック) ]
・ メールアドレス:入力条件設定 [ zh (全->半変換) m (メール形式チェック) ]
disabled解除設定 [ email2.value ]
メールアドレス入力で、メールアドレス再確認を解除
・ メールアドレス再確認:
入力条件設定 [ zh (全->半変換) as-[field名] (メールアドレスとの一致チェック) ]
・ Select選択1:disabled解除設定
[ select2.02 ] Select選択1のvalue値[ 02(select2) ] で select選択2を解除
[ checkbox3.03 ] Select選択1のvalue値[ 03(select3) ] で checkbox3選択を解除
・ Select選択2:選択数条件設定 [ 2-2 ] 2つ選択が無ければエラー
disabled解除設定
[ checkbox.value ] Select選択2のvalue値[ 選択があれば ] で checkbox選択を解除
・ ※ 数値関係のエラーは html書込表示エラー設定
( 全てのエラーをhtml書込表示又は、吹き出し表示への設定可 )
★ checkbox、radioは、エラー表示サンプルの為、Value値無を設けています。
・ checkbox選択:選択数条件設定 [ 0-2 ] 2つ以上の選択があればエラー
・ checkbox2選択:選択数条件設定 [ 0-2 ] 2つ以上の選択があればエラー
・ ※ checkbox2選択:フィールドエラーカラーではなくタグ囲みでエラーカラー
・ checkbox3選択:選択数条件設定 [ 0-2 ] 2つ以上の選択があればエラー
・ ※ checkbox3選択、radio2 選択:Label使用の場合のサンプル
・ 年月日: 年月日セット設定 [ year.mon.day ... ]
disabled解除設定
年 => [ mon.value ] 年のvalue値[ 選択があれば ] 月を解除
月 => [ day.value ] 月のvalue値[ 選択があれば ] 日を解除
・ 予定日: 年月日セット設定 [ ear2.mon2.day2 ... ]
1. デフォルト表示を本日の年月日表示設定
2. 過去となった年月日のカット設定
3. 西暦自動書込(5年)設定 ※ 自動延長にもなります
・ ※ 年月日、予定日:月の末日日以降の日は自動カットされます。( 31日の無い日や閏年関係 )
・ ファイルアップ (multiple):
選択数条件設定 [ 2-2 ] 2ファイル選択が無ければエラー
ファイル容量設定 [ 300.8 ] 100KB以上でエラー ( .エラー番号)
ファイルサイズ設定 [ 640.480 ] 幅640px、高さ480px以上でエラー
※ 以降 [ .0.150.. ]
エラー番号 => 0 ( 固定の為 0設定 ) .
ロード表示幅 => 150 (0でロード無効) . ロード表示高 => 空設定 (auto) .
PromiseによるロードIE有無 => 空設定(IEでは使わない) 1=> 使う
・ ファイルアップ:
ファイル容量設定 [ 300.8 ] 100KB以上でエラー ( .エラー番号)
※ 以降 [ .0.180.. ] ロード表示幅 => 180
・ 備考欄:文字数制限設定 (半角数値)
[ 40+40 ] 全角20文字以下は残り文字数メッセージ(+)、
全角20文字以上でエラー表示
・ 個人情報の取扱い:通常の必須設定 [1] を [4] (エラー番号) に設定
・ ※ 必須設定 [1]でのエラーメッセージは、エラー番号 [3] 以下の共通固定メッセージ
・ [ 確認画面 ] Submit:
Submit用吹き出しエラー表示設定 => 各フィールドエラー表示
( ※ 非表示や総合して1文メッセージも可 )
Submit用吹き出しのスクロール・オンマウス移動 =>
スクリーン769px以上での有効設定 ( ※ 但し、タッチ画面は無効処理 )
各フィールドエラー表示設定 => 吹き出し( 常時表示設定 )、Html書込、
フィールドエラーカラー全て有効設定