Gluegent Flow 活用例：入力フォーム値によって他の項目表示を切り替えるには？

クラウド型ワークフローであるGluegent FlowはG Suite(旧Google Apps）やOffice 365と連携し、クラウド上で様々なワークフローを実現できるサービスです。 Gluegent Flowでは様々な種類の入力フォーム項目を定義できます。またGoogle DocsレイアウトやHTMLレイアウト機能を用いれば自由に配置した帳票デザインも可能です。 

ほとんどの帳票では、あらかじめ定義した項目およびレイアウトをそのまま表示する運用で問題ないでしょうが、項目数が多い帳票の場合は選択値によって他の入力フォーム項目を非表示にしたいケースもあります。
今回は、Gluegent Flowの項目表示切替の方法をご説明します。

Gluegent Flowで項目表示を切り替える方法

今回は「私有端末利用申請」というサンプル帳票をベースに説明していきます。
この帳票は、申請者の私有端末の種別とその種別毎に応じたセキュリティ確認事項を回答するような入力フォームです。
例えば入力フォーム項目「端末種別」で”PC”が選択された場合、モバイル端末に関するセキュリティ確認事項は返答する必要がないため、画面から非表示としたい場合を考えてみましょう。

↓

＜端末種別＝「PC」の場合＞

＜端末種別＝「モバイル端末」の場合＞

Gluegent Flowで入力フォーム値によって他の項目の表示・非表示を切り替える場合、2つの方法があります。

1. 単一チェックにおける項目表示切替を利用する
2. 入力チェック機能の「項目表示制御」を利用する

「端末種別」は単一チェックのため、まず上記1の設定方法から説明していきます。

単一チェック値に基づく項目表示切替を利用する方法

設定手順は以下の通りです。

1. 表示／非表示としたい部分について、ラベル部分 も含めて全て入力フォーム項目として定義する。
2. 上記1で定義した項目名をGoogleドキュメントやHTMLレイアウトを使ったレイアウトに追記する。
3. 単一チェック項目の設定「項目表示切替」で値毎に非表示としたい項目を指定する

上記1,2ですが、通常は「＜PCの場合＞」のようにラベルとしてレイアウト上に直接記載していることが多いでしょう。しかし、表示切替を行いたい場合はそのままでは非表示にできません。ラベル部分は以下のような入力フォーム項目として個別に定義します。

ラベルに対する定義例
• データ種別：カスタムラベル
• スクリプト：ラベルとして出力したい文字列を return "＜PCの場合＞"; のように記載する（例：＜PCの場合＞）
• 経路毎の表示：すべて「表示」

ラベル部分の項目定義が終わったら、GoogleドキュメントやHTMLレイアウトを使ったレイアウトにプレースホルダ形式で反映します。詳細は以下の図を参照してください。

※Google Docsテンプレートを利用する場合、必ず再読込ボタンを忘れずに推しましょう。

最後に単一チェックで選択された値に応じて非表示としたい入力フォーム項目を指定します。

例えば、値＝PCの場合、「モバイル〜」から始まる入力フォーム項目は全て非表示としたいので、以下の図のように選択・グレーアウトにします。

以上の設定を行うと、次に示すような項目の表示切替が実現できます。

＜端末種別＝「PC」の場合＞

＜端末種別＝「モバイル端末」の場合＞

入力チェック機能の「項目表示制御」を利用する方法

上記の方法でも問題ないですが、以下の課題が残ります。

• 単一チェック値の場合しか設定できない（例えばリスト値に従った表示切替ができない）
• 複数の項目値に従った表示切替ができない
• 初期表示時は表示切替の対象項目が全て表示されてしまう

この課題をクリアしたい場合、入力チェック機能の「項目表示制御」を利用してみましょう。設定手順は以下の通りです。

1. モデル編集のタブ「入力チェック」を選択し、種別「項目表示制御」を選択する
2. スクリプト欄に表示制御のためのスクリプトを記述する。
• スクリプト記述では何の項目が、どの値のときに、どの項目を「非表示」としたいか？を記述します。
• 非表示としたい項目は配列形式（角カッコで囲む）で列挙します。
• 以下に上記で設定したものと同じ内容を記載したサンプルを掲載しますので参考にしてみてください。

入力チェック機能の「項目表示制御」を利用すると、以下の通り、単一チェック以外のリスト項目の値に応じて表示を切り替えることができます。

以上、Gluegent Flowの項目表示切替の実現方法についてご紹介しました。是非参考にしてみてください。

→モデル編集　項目表示制御