ここでは「入力チェック」の「項目表示制御」について説明します。
項目表示制御
項目表示制御実行結果
スクリプト
お試し実行
項目表示制御
「項目表示制御」は条件による入力フォームの表示 / 非表示を制御できます。
- タイプ
- 「項目表示制御」を選択します。
- 名前
- 入力チェックの名前を設定します。任意の名前を設定してください。
- 説明
- 入力チェックの説明を設定します。
- スクリプト
- スクリプトを設定します。
- お試し実行
- スクリプトの確認を行うために、スクリプトを実行できます。バインド値には、試したい値を設定し、スクリプトを確認してください。
- 経路ごとの表示・実行設定
- このチェックの実行有無を経路ごとに設定することはできません。定義した場合、全ての経路でチェックが実行されます。
重要:
「項目表示制御」はモデルに対して 1 つしか定義できません。複数作成するとエラーになります。
また、入力フォームのタイプ「単一チェック」の「項目表示切替」との併用もできません。
1 つのモデルで使用できる「項目表示制御」「項目表示切替」は 1 つだけです。
項目表示制御実行結果
スクリプト(後述)の条件に従い、他の入力フォームの表示/非表示を制御します。項目表示制御を作成した時に入力されているスクリプトを使った場合、以下のように動作します。
入力フォームでそれぞれのフォームを作成します。
「itemName1」→単一チェック(選択肢は「Radio-1」「Radio-2」)
「itemName2」「itemName3」「itemName4」→単行テキスト
例1) itemName1 で、「Radio-1」を選択した場合
「itemName2」「itemName3」が非表示となります。
例2)itemName1 で、「Radio-2」を選択した場合
「itemName4」が非表示となります。
スクリプト
スクリプトは、画面の初期表示時とスクリプト内で指定された入力フォームに値が入力された際に実行されます。
項目表示制御で使用できるスクリプトは以下のルールに従って記述してください。
- 使用できるスクリプトの構文は、JavaScript と同一です。
- 入力フォームで入力された値を参照する場合は、プレースホルダーで記述します。
- スクリプトの実行結果として「表示したい項目名」を配列型で返してください。
- スクリプト内で、JavaScript の function 等を定義することも可能です。
重要:
ここで使用するスクリプトについては、サポート対象外となります。入門書や Web サイトをご覧いただき解決してください。
スクリプトの例1
以下の条件で項目の表示 / 非表示を制御します。入力フォームの「申請区分」の入力内容により、他の入力フォーム「新規経路」「追加経路」「追加料金」の表示 / 非表示を制御します。
申請区分 | 表示される項目 |
---|---|
新規 |
新規経路 |
追加 |
追加経路 |
追加料金 |
以下のスクリプトを入力します。
if (${申請区分} == "新規" ) {
return ["追加経路", "追加料金"];
}
return ["新規経路"];
返り値として非表示にしたい項目名を返します。新規の場合は「追加〜」の項目を非表示にし、追加の場合は「新規〜」の項目を非表示にするため、上記のようなスクリプトになります。
スクリプトの例2
以下の条件で項目の表示 / 非表示を制御します。入力フォームの「制御区分」の入力内容により、他の入力フォーム「新住所」「旧住所」の表示 / 非表示を制御します。
制御区分 | 表示される項目 |
---|---|
新規 |
新住所 |
変更 |
新住所 |
旧住所 |
以下のスクリプトを入力します。
if (${制御区分} == "新規" ) {
return ["旧住所"];
}
return "";
変更の場合は全ての項目を表示し、非表示にする項目がないため、上記のようなスクリプトになります。
スクリプトの例3
以下の条件で項目の表示 / 非表示を制御します。入力フォームの「交通手段」の入力内容により、他の入力フォーム「交通機関名」「車種」の表示非表示を制御します。更に「性別」の入力内容により、他の入力フォーム「婦人科検診希望」の表示 / 非表示を制御します。
交通手段 | 表示される項目 |
---|---|
車 |
車種 |
公共機関 |
交通機関名 |
徒歩 |
なし |
性別 | 表示される項目 |
---|---|
男 |
なし |
女 |
婦人科検診希望 |
以下のスクリプトを入力します。
var result = new Array();
if (${交通手段} == "車") {
result.push("交通機関名");
} else if (${交通手段} == "公共機関") {
result.push("車種");
} else {
result.push("交通機関名");
result.push("車種");
}
if (${性別} != "女") {
result.push("婦人科検診希望");
}
return result;
情報:
push の他に concat も有用です。
result.push("交通機関名");
result.push("車種");
では 2 行になりますが、concat の場合は
result = result.concat(["交通機関名","車種"]);
のように、1 行で表現できます。
お試し実行
項目表示制御では、スクリプトの実行結果の確認のために、お試し実行ができます。
プレースホルダーで記述した項目値に仮の値を入力し、「お試し実行」をクリックすると「お試し実行結果」欄に結果が表示されます。
「Radio-1」を入力して実行すると、結果は「itemName2,itemName3」となります。それ以外の値を入力して実行すると結果は「itemName4」となり、スクリプトが想定通りに動作することが確認できます。
注意:
お試し実行の結果と実際のタスクデータでの実行結果が異なる場合があります。例えば、お試し実行のバインド値で未入力の場合は空文字になるが、実際の場合は「undefined」になるといった差があります。ユーザーへの公開前に様々な入力条件でテストを行ってください。