入力値によってオブジェクトの背景色・読取専用・必須入力を動的に変更する（条件設定）

✔ 概要

「条件設定」を利用することで、ユーザーの入力内容に応じて、フォーム内の別の入力オブジェクトの背景色や読取専用、必須入力の設定を動的に変更することができます。
本項では、JavaScriptを使用せずに、「条件設定」を利用して背景色・読取専用・必須入力を変更する方法を説明します。

注意

本設定は、V5.4.4以降のフォームで利用可能です。
Liteフォームおよび旧バージョン形式のフォーム（JSP／PDF）では利用できません。

ヒント

  • 申請フォーム／承認フォームに設定できます。
  • 条件設定の詳細は、Formエディターリファレンス（第2章機能説明 - 2-4. フォームオブジェクトの共通機能 - オブジェクトの表示状態を動的に変更する（条件設定））を参照ください。

本項では、以下の内容を説明します。

◇設定方法

◇条件設定の実用例

◇他の設定と併用するときの動作

◇注意事項

基本の設定方法

オブジェクトの背景色・読取専用・必須入力は、以下のプロパティ[表示]タブの項目で指定できますが、ここで指定した内容はフォームを表示したときの初期状態として反映するため、常に指定した状態となります。

ユーザーが入力・選択した内容によって、オブジェクトの背景色・読取専用・必須入力を動的に変更するときは、「条件設定」を使用します。
「条件設定」では、[条件]と[やること]の2つをセットで設定します。

  • 条件：背景色・読取専用・必須入力を変更するトリガーとなる内容（オブジェクト・入力値・演算子）を設定します。
  • やること：条件に合致したときのオブジェクトの変更内容を設定します。

設定方法

[条件設定]ダイアログの表示

Formエディターのメニューから[オプション - 条件設定]を選択します。[条件設定]ダイアログが表示されます。

ヒント

ツールバーの btn_jouken （条件設定）アイコンからも[条件設定]ダイアログを表示できます。

[条件]の設定

背景色・読取専用・必須入力を変更するトリガーとなる[条件]を設定します。

  • [条件設定]ダイアログで[条件の追加]ボタンをクリックし、[条件]の設定ダイアログを表示します。

  • [条件]を設定します。

    項目 説明
    もし／かつ
    • 1つ目の条件は「もし」
    • 複数の条件を設定する場合は「かつ」
    • 変更不可
    • AND条件のみ設定可能
    対象オブジェクト

    条件の比較対象とするオブジェクトを選択

    選択可能となるオブジェクトは、現在のページ上にある以下のオブジェクトから選択可能です。

    • 入力テキスト（日付フォーマットを除く）
    • コンボボックス
    • リストボックス
    • チェックボックス
    • ラジオボタン
    • 情報表示（承認履歴を除く）
    演算子

    オブジェクトの入力値と比較する演算子

    選択可能な演算子は設定によって異なります。

    • 入力テキスト（数値／パーセントフォーマット指定時）
      • 数値：等しい
      • 数値：等しくない
      • 数値：より大きい
      • 数値：より小さい
      • 数値：以上
      • 数値：以下
    • チェックボックス
      • チェック状態
    • 上記以外
      • 文字列：等しい
      • 文字列：等しくない
    値

    演算子で比較するオブジェクトの入力値

    設定可能な値は設定によって異なります。

    • チェックボックス
      • チェックなし
      • チェックあり
    • 上記以外
      • 固定値

    imgwarn 注意

    「値」に空文字を指定することはできません。

  • [条件]の対象オブジェクトを複数設定する場合、[追加]ボタンをクリックします。
    「かつ」の条件の行が追加され、対象オブジェクト、演算子、値が設定可能になります。

    • [条件]の対象オブジェクトを複数設定した場合

  • [OK]ボタンをクリックして[条件]を確定します。

ヒント

  • 設定済みの[条件]を編集する場合は、一覧で[条件]列をダブルクリック、または行を選択して右クリックメニューから[編集]-[条件の編集]を選択します。

  • 設定済みの[条件]を削除する場合は、一覧で削除する[条件]をチェックの上[削除]ボタンをクリック、または右クリックメニューから[削除]-[条件の削除]を選択します。

  • [条件設定]を複数設定する場合、[条件設定]ダイアログから[条件の追加]ボタンをクリックし、[条件]を設定します。

[やること]の設定

条件に合致したときに変更対象オブジェクトに対して行う変更を設定をします。
設定可能となるのは、背景色・読取専用・必須入力の設定です。

  • [条件設定]ダイアログで[やることの追加]ボタンをクリックし、[やること]ダイアログを表示します。

  • [オブジェクトの選択]ボタンをクリックして[オブジェクトの選択]ダイアログを表示します。

  • 左側のオブジェクト一覧から変更対象のオブジェクトを選択し、[追加]ボタンで右側の[変更対象のオブジェクト]に追加します。

    ヒント

    • オブジェクトが多い場合、[検索]からオブジェクト名を指定して絞り込んでください。
    • オブジェクトを変更対象から削除する場合、[変更対象のオブジェクト]から対象オブジェクトを選択して[削除]ボタンをクリックしてください。
    • 変更対象のオブジェクトは、現在のページ上にある以下のオブジェクトから選択可能です。
      • 入力テキスト
      • コンボボックス
      • リストボックス
      • チェックボックス
      • ラジオボタン

  • [OK]ボタンをクリックして[オブジェクトの選択]ダイアログを閉じます。

  • [やること]ダイアログで、条件に合致したときに変更する背景色・読取専用・必須入力を設定します。

    項目 説明
    背景色

    背景色の有効／無効

    [選択]ボタンで色を選択します。
    読取専用 読取専用の有効／無効
    必須入力 必須入力の有効／無効

    ヒント

    背景色・読取専用・必須入力のうち、変更が必要な項目のみチェックして設定します。

  • [OK]ボタンをクリックして[やること]を確定します。

ヒント

  • 設定済みの[やること]を編集する場合は、[条件設定]ダイアログの一覧で[変更対象のオブジェクト]以降の列をダブルクリック、または行を選択して右クリックメニューから[編集]-[やることの編集]を選択します。

  • 設定済みの[やること]を削除する場合は、[条件設定]ダイアログの一覧の削除する[やること]を選択して右クリックメニューから[削除]-[やることの削除]を選択します。

注意

[条件設定]はページごとに設定します。他のページのオブジェクトは設定できません。

imggotop ページTOPへ

入力テキストの入力値によって、別の入力テキストの背景色・読取専用・必須入力を変更する

想定する動作

入力テキストの入力値によって他の入力テキストの背景色・読取専用・必須入力を変更します。

これにより、 [条件]の入力テキストで「a」を入力したときは、[やること]の入力テキストの背景色がピンクになり文字入力が可能となり、文字を入力しないと申請や承認ができなくなります。

フォームの設定

オブジェクトの配置

  • [条件]のオブジェクト
種類 オブジェクト名 プロパティの設定内容
入力テキスト TEXT_JOUKEN

  • [表示]タブの設定

    項目名 設定値
    [プロパティ] - [読取専用] 無効
  • [やること]の変更対象オブジェクト
種類 オブジェクト名 プロパティの設定内容
入力テキスト TEXT_YARUKOTO

  • [表示]タブの設定

    項目名 設定値
    [背景色] 無効
    [プロパティ] - [読取専用] 有効
    [プロパティ] - [必須入力] 無効

[条件設定]の設定

[条件設定]を設定します。設定後は以下のようになります。

  • [条件]の設定

    項目 設定
    もし／かつ 「もし」固定（条件が1つのため）
    対象オブジェクト TEXT_JOUKEN
    演算子 文字列：等しい
    値

    a

    大文字／小文字、半角／全角は区別されます。

  • [やること]の設定

    項目 設定
    変更対象のオブジェクト TEXT_YARUKOTO
    背景色 チェックあり／ピンク
    読取専用 無効
    必須入力 有効

動作確認

[条件]で設定した入力テキストの入力によって動作が変わることを確認します。

[条件]の入力テキストに「a」を入力したとき 「[条件設定]の設定」 が適用され、[やること]の入力テキストの設定は以下のように変更されます。

  • [背景色]の設定が ピンク となる
  • [読取専用]の設定が 無効 となり、文字が入力できる
  • [必須入力]の設定が 有効 となり、文字が未入力の場合は申請や承認の操作が確定できない

[やること]の入力テキストが未入力の状態で送信ボタン（[申請する]／[承認する]ボタン）をクリックしたとき、必須入力であるメッセージが表示され申請や承認の操作が確定できません。

参考

必須入力の項目が未入力の場合の警告メッセージの項目名を任意の値に設定することができます。
以下を参照ください。

imggotop ページTOPへ

コンボボックスの選択によって、チェックボックスの背景色・読取専用・必須入力を変更する

想定する動作

コンボボックスの選択によってチェックボックスの背景色・読取専用・必須入力を変更します。

これにより、 [条件]のコンボボックスで「b（書き出し値：2）」を選択したときは、[やること]のチェックボックスの背景色がグレーになり、チェックのオン・オフの切り替えが不可となります。チェックがなくても申請や承認を行うことができる状態となります。

フォームの設定

オブジェクトの配置

  • [条件]のオブジェクト
種類 オブジェクト名 プロパティの設定内容
コンボボックス COMBO_JOUKEN

  • [オプション]タブの設定

    項目名 書き出し値
    a　※初期選択項目 1
    b 2
    c 3
  • [やること]の変更対象オブジェクト
種類 オブジェクト名 プロパティの設定内容
チェックボックス CHECK_YARUKOTO

  • [表示]タブの設定

    項目名 設定値
    [背景色] ピンク
    [プロパティ] - [読取専用] 無効
    [プロパティ] - [必須入力] 有効

[条件設定]の設定

[条件設定]を設定します。設定後は以下のようになります。

  • [条件]の設定

    項目 設定
    もし／かつ 「もし」固定（条件が1つのため）
    対象オブジェクト COMBO_JOUKEN
    演算子 文字列：等しい
    値

    2

    コンボボックスの「書き出し値」の値を指定します。

  • [やること]の設定

    項目 設定
    変更対象のオブジェクト CHECK_YARUKOTO
    背景色 チェックあり／グレー
    読取専用 有効
    必須入力 無効

動作確認

[条件]で設定したコンボボックスの選択によって動作が変わることを確認します。

コンボボックスの「b」を選択したとき 「[条件設定]の設定」 が適用され、チェックボックスの設定は以下のように変更されます。

  • [背景色]の設定が グレー となる
  • [読取専用]の設定が 有効 となり、チェックできない
  • [必須入力]の設定が 無効 となり、チェックなしでも申請や承認の操作が確定できる
imggotop ページTOPへ

ラジオボタンの選択によって、コンボボックスの背景色・読取専用・必須入力を変更する

想定する動作

ラジオボタンの選択によってコンボボックスの背景色・読取専用・必須入力を変更します。

◇項目A／項目Bを選択したとき

◇その他を選択したとき

ヒント

コンボボックスの「書き出し値：半角スペース」の選択項目は未入力の状態となります。
「必須入力」が有効なとき「書き出し値：半角スペース」が選択されていると、申請・承認時に必須入力エラーとなります。

これにより、 [条件]のラジオボタンで「項目A（書き出し値：1）」「項目B（書き出し値：2）」を選択したときは、[やること]のコンボボックスの背景色がグレーになり、選択不可となります。
また、 [条件]のラジオボタンで「その他（書き出し値：3）」を選択したときは、[やること]のコンボボックスの背景色がピンクになり、選択可能な状態となります。「--選択してください--（書き出し値：半角スペース）」が選択されている場合、未入力のため申請や承認ができなくなります。

フォームの設定

オブジェクトの配置

  • [条件]のオブジェクト
種類 オブジェクト名 プロパティの設定内容
ラジオボタン RADIO_JOUKEN

  • [オプション]タブの設定

    ラベルを表示する（項目名） 書き出し値
    項目A 1
    項目B 2
    その他 3
  • [やること]の変更対象オブジェクト
種類 オブジェクト名 プロパティの設定内容
コンボボックス COMBO_YARUKOTO

  • [表示]タブの設定

    項目名 設定値
    [背景色] なし
    [プロパティ] - [読取専用] 有効
    [プロパティ] - [必須入力] 無効

  • [オプション]タブの設定

    項目名 書き出し値
    --選択してください-- （半角スペース）
    選択項目1 1
    選択項目2 2

[条件設定]の設定

[条件設定]を設定します。「その他（書き出し値：3）」選択時とそれ以外選択時の2つを設定します。

ヒント

演算子「!=」は「文字列：等しくない」「数値：等しくない」を選択したときの演算子です。

◇「その他（書き出し値：3）」以外選択時の[条件設定]

  • [条件]の設定

    項目 設定
    もし／かつ 「もし」固定（条件が1つのため）
    対象オブジェクト RADIO_JOUKEN
    演算子 文字列：等しくない
    値

    3

    ラジオボタンの「書き出し値」の値を指定します。

  • [やること]の設定

    項目 設定
    変更対象のオブジェクト COMBO_YARUKOTO
    背景色 チェックあり／グレー
    読取専用 有効
    必須入力 無効

◇「その他（書き出し値：3）」選択時の[条件設定]

  • [条件]の設定

    項目 設定
    もし／かつ 「もし」固定（条件が1つのため）
    対象オブジェクト RADIO_JOUKEN
    演算子 文字列：等しい
    値

    3

    ラジオボタンの「書き出し値」の値を指定します。

  • [やること]の設定

    項目 設定
    変更対象のオブジェクト COMBO_YARUKOTO
    背景色 チェックあり／ピンク
    読取専用 無効
    必須入力 有効

動作確認

[条件]で設定したラジオボタンの選択によって動作が変わることを確認します。

項目A／項目Bを選択したときの動作

ラジオボタンの「項目A」や「項目B」を選択したとき 「[条件設定]の設定」 が適用され、コンボボックスの設定は以下のように変更されます。

  • [背景色]の設定が グレー となる
  • [読取専用]の設定が 有効 となり、選択できない
  • [必須入力]の設定が 無効 となり、選択なしでも申請や承認の操作が確定できる

その他を選択したときの動作

ラジオボタンの「その他」を選択したとき 「[条件設定]の設定」 が適用され、コンボボックスの設定は以下のように変更されます。

  • [背景色]の設定が ピンク となる
  • [読取専用]の設定が 無効 となり、選択できる
  • [必須入力]の設定が 有効 となり、選択なしの場合は申請や承認の操作が確定できない

コンボボックスの「--選択してください--」を選択した状態で送信ボタン（[申請する]／[承認する]ボタン）をクリックしたとき、必須入力であるメッセージが表示され申請や承認の操作が確定できません。

参考

必須入力の項目が未入力の場合の警告メッセージの項目名を任意の値に設定することができます。
以下を参照ください。

コンボボックスの「--選択してください--」以外を選択した状態で送信ボタン（[申請する]／[承認する]ボタン）をクリックしたとき、必須入力であるメッセージは表示されずに申請や承認の操作が確定できます。

imggotop ページTOPへ

情報表示フィールドとチェックボックスの複数条件で、ラジオボタンの読取専用を変更する

想定する動作

情報表示フィールドの表示とチェックボックスのチェック状態によってラジオボタンの背景色・読取専用を変更します。

これにより、 「部長」が決裁時に[条件]のチェックボックスにチェックしたときは、[やること]のラジオボタンの背景色が水色になり、ラジオボタンの読取専用が無効になって選択可能になります。

フォームの設定

オブジェクトの配置

  • [条件]のオブジェクト
種類 オブジェクト名 プロパティの設定内容
情報表示 DCN_AUTH-A

  • [情報の種類]タブの設定

    • [表示する情報の種類] 決裁者 - [項目]役職

    オブジェクト名は選択内容によって自動で設定されます。
チェックボックス CHECK_JOUKEN

  • [表示]タブの設定

    項目名 設定値
    [プロパティ] - [読取専用] 無効

  • [オプション]タブの設定

      書き出し値
    チェック時 1
    非チェック時 0
  • [やること]の変更対象オブジェクト
種類 オブジェクト名 プロパティの設定内容
ラジオボタン RADIO_YARUKOTO

  • [表示]タブの設定

    項目名 設定値
    [背景色] グレー
    [プロパティ] - [読取専用] 有効

  • [オプション]タブの設定

    ラベルを表示する（項目名） 書き出し値
    項目A 1
    項目B 2

[条件設定]の設定

[条件設定]を設定します。[条件]を複数設定します。

  • [条件]の設定

    • 1つ目の[条件]

      項目 設定
      もし／かつ 「もし」固定（条件が1つ目のため）
      対象オブジェクト DCN_AUTH-A
      演算子 文字列：等しい
      値 部長

    • 2つ目の[条件]

      項目 設定
      もし／かつ 「かつ」固定（条件が2つ目のため）
      対象オブジェクト CHECK_JOUKEN
      演算子 チェック状態
      値 チェックあり

      ヒント

      チェックボックスを[条件]に設定するときの演算子は「チェック状態」となり、値は「チェックあり／なし」の選択となります。
      書き出し値は使用しません。

  • [やること]の設定

    項目 設定
    変更対象のオブジェクト RADIO_YARUKOTO
    背景色 水色
    読取専用 無効

動作確認

[条件]で設定した情報表示フィールドの表示とチェックボックスの選択によって動作が変わることを確認します。

「部長」が決裁するために承認フォームを開き、チェックボックスにチェックしたとき 「[条件設定]の設定」 が適用され、ラジオボタンの設定は以下のように変更されます。

  • [背景色]の設定が 水色 となる
  • [読取専用]の設定が 無効 となり、選択できる
imggotop ページTOPへ

特定表示区分やJavaScriptと条件設定を併用するときの動作

類似の設定となる「条件設定」「特定表示区分」「JavaScript」の設定を併用した場合の挙動（優先順位）を説明します。
「特定表示区分」は、指定した承認者が入力フォームを表示した場合にオブジェクトの外観や表示状態（非表示／読取専用）を制御することができます。
また「JavaScript」を使用することで、オブジェクトの入力値によって他のオブジェクトの背景色・読取専用・必須入力を制御することができます。
本項の「条件設定」も同様に背景色・読取専用・必須入力を制御する機能です。
「特定表示区分」や「JavaScript」を設定したフォームに、本項の「条件設定」を設定した場合の動作を説明します。

参考

特定表示区分については、以下を参照ください。

JavaScriptについては、以下を参照ください。

条件設定と特定表示区分とJavaScriptが同時に設定されているとき、優先順位は以下となります。

優先順１（最優先） 優先順２ 優先順３
条件設定 特定表示区分 JavaScript

入力テキストの背景色を特定表示区分、JavaScript、条件設定でそれぞれ別の色に変更する設定にした場合、条件設定の動作が優先されます。

  設定 動作
特定表示区分のみ

「決裁者」が入力フォームを表示したときに入力テキストの背景色を緑色にする
JavaScriptのみ

「部長」の決裁時に入力テキストの背景色を黄色にする
※フォームを表示したときに実行する JavaScript

let val = document.getElementsByName('DCN_AUTH-A')[0]
            .value;
if( val == '部長' ){
  //背景色の変更
  document.getElementsByName('TEXT_YARUKOTO')[0]
    .style.backgroundColor = '#FFEF6C';
}
条件設定のみ

「部長」の決裁時に入力テキストの背景色を水色にする
・特定表示区分
・JavaScript
・条件設定

すべて設定
  • 特定表示区分：「決裁者」が入力フォームを表示したときに入力テキストの背景色を緑色にする
  • JavaScript：「部長」の決裁時に入力テキストの背景色を黄色にする
  • 条件設定：「部長」の決裁時に入力テキストの背景色を水色にする

決裁者である「部長」が決裁するために入力フォームを表示したとき、条件設定の動作となる

ヒント

条件設定が設定されていても[条件]に合致していない場合、他の設定の動作となります。[条件]に合致すると条件設定の通りの動作となります。

例）特定表示区分と条件設定が併用された場合

[条件]に合致しない状態のとき [条件]に合致する状態のとき

特定表示区分の設定の動作となる

条件設定の設定の動作となる
imggotop ページTOPへ

注意事項

オブジェクトの入力値によって他のオブジェクトの背景色・読取専用・必須入力を変更するときの注意点を説明します。

条件設定で設定した表示制御はPDFには反映されない

条件設定で設定した制御はフォーム上のみ反映されます。
申請や承認を確定したときの文書（PDF）やPDFプレビューの結果に対しては、条件設定で設定した表示状態は反映されません。

以下のように入力テキストの背景色を[条件設定]で水色に変更してPDFプレビューしたとき、PDFではFormエディター上で設定した入力テキストのプロパティの設定内容の表示になります。

フォームの表示状態 PDFプレビューでの表示状態

※プロパティの設定内容

ヒント

特定表示区分・JavaScriptで設定した制御も同様にPDFには反映されません。

変更対象オブジェクトの同名オブジェクトすべてに反映される

[やること]の変更対象オブジェクトと同名のオブジェクトが各ページに複数配置されているとき、すべてのページの同名オブジェクトに対して[やること]の設定内容が反映されます。

以下のように入力テキストの背景色を条件設定で変更したとき、変更対象オブジェクトと同名のオブジェクトすべてに反映されます。

[条件]に合致する前 [条件]に合致した後

[条件]の対象オブジェクトの[マルチフォームでオブジェクトをページごとに区別する]が有効のとき、[やること]の変更対象オブジェクトも同設定が有効の場合のみ変更される

マルチフォームが設定されたページで、[条件]の対象オブジェクトの[マルチフォームでオブジェクトをページごとに区別する]が有効のとき、[やること]の変更対象オブジェクトの同設定も有効にする必要があります。
[やること]の変更対象オブジェクトの[マルチフォームでオブジェクトをページごとに区別する]が無効の場合、変更は反映されません。

[マルチフォームでオブジェクトをページごとに区別する]の有効／無効と変更の適用は以下となります。

[条件]の対象オブジェクトの
[マルチフォームでオブジェクトをページごとに区別する]		 [やること]の変更対象オブジェクトの
[マルチフォームでオブジェクトをページごとに区別する]		 変更の適用
　
有効 有効 変更される
有効 無効 変更されない
無効 有効 変更される
無効 無効 変更される

[条件]の対象オブジェクトや[やること]の変更対象オブジェクトを変更した場合、条件設定は動作しない

[条件]の対象オブジェクトや[やること]の変更対象オブジェクトに以下の変更を行った場合、条件設定は動作しません。

  • オブジェクトのフォーマット変更（数値 ⇔ それ以外）
  • オブジェクトの種別変更
  • オブジェクトの削除
  • オブジェクト名の変更

オブジェクトの変更を行った場合、再度変更した後のオブジェクトに合わせて条件設定([条件]と[やること])を設定し直してください。

例）

  • オブジェクトのフォーマットを数値から文字列に変更した場合：演算子や値を設定し直します。
  • オブジェクト名を変更した場合：オブジェクトを設定し直します。

動作保証外の条件設定

以下のような条件設定は制限事項となり、動作保証外となります。

◇複数の条件設定の指定があるときに[やること]が相反する動作の場合

  • 1ページ内に複数の条件設定がある例

    （単一ページ） 条件 やること
    条件設定1 「オブジェクトA」の入力値が「1」と等しい 「オブジェクトC」の背景色を 水色 に変更
    条件設定2 「オブジェクトB」の入力値が「1」と等しい 「オブジェクトC」の背景色を 黄色 に変更

  • 複数ページの同名オブジェクトに条件設定がある例

    （複数ページ） 条件 やること
    条件設定-1ページ目 1ページ目の「オブジェクトA」の入力値が「1」と等しい 1ページ目の「オブジェクトC」の背景色を 水色 に変更
    条件設定-2ページ目 2ぺージ目の「オブジェクトA」の入力値が「1」と等しい 2ページ目の「オブジェクトC」の背景色を 黄色 に変更

条件設定の制限

条件設定の設定可能数などの制限は以下の通りです。

  設定可能数 制限
条件設定

1ページにつき最大20件

申請・承認フォームに作成できるページはそれぞれ最大99ページです。
 －
条件 1つの条件設定につき最大10件

  • [値（文字列）]

    半角／全角で最大100文字

  • [値（数値）]

    整数部11 桁、小数部3桁
やること 1つの条件設定につき最大10件

  • [変更対象のオブジェクトの設定可能数]

    1つの[やること]につき最大100件

  • [やることの内容]

    背景色／読取専用／必須入力から1つ以上の設定が必須
imggotop ページTOPへ