XPagesの入力チェック（エラー表示）

まず最初に、この度の西日本豪雨で被害に遭われた方に心よりご冥福とお悔やみを申し上げます。

被災された方々に心よりお見舞いを申し上げ、一日も早い回復と、被災地の早期復旧をお祈りいたします。

また、酷暑の中での復旧作業に携わる皆様のご安全をお祈り申し上げます。

こんばんは

毎日、35度を超える気温で体調お変わりないでしょうか

筆者も出社途中にセミの鳴き声を聞き、今年も夏がやってきたんだなと感じました

また、夜には近所の川で蛍が鑑賞できます

もうすぐで学生は夏休みですねー

話は戻り・・・

「XPagesの入力チェック」って皆様はどのような方法をとっていますか

個人的にちょっと興味があったので、色々試してみたので紹介したいと思います。

１）オーソドックスなやり方ですが、コントロールの検証タブで行う入力チェック

必須フィールドにチェックを入れて、エラーメッセージを記述。

長さバリデータもついでに制御したいと思います。

＜結果＞

未入力時

長さバリデータの設定値以外

楽ちんですねー

２）エラー表示コントロール/複数エラー表示コントロールを使用する場合

１．編集ボックスコントロールの検証タブの設定は１のまま設定した状態のまま

エラー表示コントロールを配置し、次のエラーメッセージを表示にて、対象のコントロールのID名を指定します。

２．編集ボックスコントロールのすべてのプロパティから「disableClientSideValidation」の値を「true」に設定します。

３．上記でエラー表示コントロールの設置は完了ですが、

ついでなので複数エラー表示コントロールも配置します。

＜結果＞

未入力時

長さバリデータの設定値以外

こちらも案外簡単に配置できました

３）CSJSでアラート表示

今度はCSJSで、１の検証に近いものが出来ないかやってみました。

ボタンを配置し、以下のコードをイベントタブ＞クライアントタブに記述します。

var str = document.getElementById("#{id:field11}").value;
var reg = new RegExp(/^([a-zA-Z0-9]{1,5})$/);
var res = reg.test(str);
 
 if(str==''){
     alert('入力必須です。');
     return false;
 }
 
  if(res==false){
     alert('1文字以上5文字以下で入力してください');
     return false;
 }

注）RegExpとは？

＜結果＞

未入力時

長さバリデータの設定値以外

案外近いものが出来ました（ほぼ同じ？）

４）CSJSで入力チェックinnerHTML表示

先ほど、エラー表示コントロール/複数エラー表示コントロールを使ってやってみたことをCSJSで実装してみます。

ボタンを配置し、以下のコードをイベントタブ＞クライアントタブに記述します。

 var str = document.getElementById("#{id:field11}").value;
 var reg = new RegExp(/^([a-zA-Z0-9]{1,5})$/);
 var res = reg.test(str);
 
 
  if(str==''){
      document.getElementById("#{id:computedField1}").innerHTML = '入力必須です。';
      document.getElementById("#{id:computedField2}").innerHTML = '入力必須です。';
      return false;
  }

 if(res==false){
      document.getElementById("#{id:computedField1}").innerHTML = '1文字以上5文字以下で入力してください';
      document.getElementById("#{id:computedField2}").innerHTML = '1文字以上5文字以下で入力してください';
        
     return false;
 } 

＜結果＞

未入力時

長さバリデータの設定値以外

スタイル入れたら、似たようなことも可能

他にも、SSJSでエラーチェックしてみたり

エージェントでチェックしてみたりと方法はたくさんあると思います。

開発したDBに合ったエラー表示をこだわるのもいいかもしれませんね
（エラーなんて出ないことが1番だけど）

では、今日はこの辺で・・・

あでゅー