kintoneプラグイン『機能拡張スタンダード All-In』を使ってフィールド非表示・表示切り替えを行う

kintoneプラグイン[『機能拡張スタンダード All-In』](https://spica.tokyo/bluelaunch)の<strong>フィールド属性</strong>を使用します。
![bl_ss_gen_フィールド属性.png](https://qiita-image-store.s3.amazonaws.com/0/67365/43a25731-472e-e35a-2b3c-3e43c2819fe8.png)

#概要

作成中または作成済みのレコードの入力内容に応じて、フィールドの表示・非表示を切り替えるサンプルです。

#例１. ドロップダウンの選択で表示を切り替える

以下のフィールドをもつアプリでサンプルを設定していきます。
・文字列（1行）
・数値
・ドロップダウン
![bl_ss_170806_02.png](https://qiita-image-store.s3.amazonaws.com/0/67365/4a467666-888f-268b-795c-83089acf46d7.png)

##例１の設定概要
ドロップダウンで「選択１」を選んだときは「文字列（1行）」を非表示にする。
ドロップダウンで「選択２」を選んだときは「数値」を非表示にする。

##例１のプラグイン設定

![bl_ss_170806_03c.png](https://qiita-image-store.s3.amazonaws.com/0/67365/bd27d8d8-abf8-fe68-3390-b7948be06023.png)

「対象フィールドセット」が3つあります。
① 最初に「文字列（1行）」「数値」ともに表示している状態を設定します
・対象フィールドに「文字列（1行）」「数値」をチェック
・その他の設定はとくになし

② ドロップダウンで「選択１」を選んだときに「文字列（1行）」を非表示にする設定
・対象フィールドに「文字列（1行）」をチェック
・設定条件として、ドロップダウンが選択１と等しい、という条件を設定
・「非表示」をチェック

③ ドロップダウンで「選択２」を選んだときに「数値」を非表示にする設定
・対象フィールドに「数値」をチェック
・設定条件として、ドロップダウンが選択２と等しい、という条件を設定
・「非表示」をチェック

##実際の動作
レコードを作成・編集中。
ドロップダウンの選択を変更することで表示・非表示が切り替わります。
![bl_ss_170806_04.png](https://qiita-image-store.s3.amazonaws.com/0/67365/dec42291-1066-ae2e-3531-9abf7d8e5223.png)

作成済みのレコードでも非表示状態となります。
![bl_ss_170806_05.png](https://qiita-image-store.s3.amazonaws.com/0/67365/adc94918-3b35-94d0-c2fe-a8a498f91478.png)

#例２. 回答の条件によって別フィールドの表示/非表示を切り替える

cybozu developer networkのカスタマイズ例、[「回答の条件によって別フィールドの表示/非表示を切り替える」]
(https://developer.cybozu.io/hc/ja/articles/202377614-%E5%9B%9E%E7%AD%94%E3%81%AE%E6%9D%A1%E4%BB%B6%E3%81%AB%E3%82%88%E3%81%A3%E3%81%A6%E5%88%A5%E3%83%95%E3%82%A3%E3%83%BC%E3%83%AB%E3%83%89%E3%81%AE%E8%A1%A8%E7%A4%BA-%E9%9D%9E%E8%A1%A8%E7%A4%BA%E3%82%92%E5%88%87%E3%82%8A%E6%9B%BF%E3%81%88%E3%82%8B)をこのプラグインで設定してみます。

こんな感じのアプリを作ってみました。
![bl_ss_170806_06.png](https://qiita-image-store.s3.amazonaws.com/0/67365/0f82a22d-1516-d0fa-4da5-6be96526deab.png)

##例２のプラグイン設定
表示切り替えの対象となるフィールドを「対象フィールドセット」で選択して、切り替えのスイッチとなるフィールドを条件判定に設定していきます。

###「1,今までかかった病気はありますか？」の複数選択フィールドで<strong>その他</strong>がチェックされていたときに<font color="MediumBlue">「その他」</font>を表示する
![bl_ss_170806_07.png](https://qiita-image-store.s3.amazonaws.com/0/67365/06c65c3f-5cb8-5df6-bfeb-b2a2d2f25fb9.png)

###「2,今までに受けた予防接種はありますか？」のラジオボタンで<strong>ある</strong>がチェックされていたときに<font color="MediumBlue">「アレルギーの原因」</font>を表示する
![bl_ss_170806_08.png](https://qiita-image-store.s3.amazonaws.com/0/67365/9bfeaabc-eebe-4f75-e3f6-7b59f68c3108.png)

###「3,治療中の病気はありますか？」のラジオボタンで<strong>はい</strong>がチェックされていたときに<font color="MediumBlue">「病名」「発症した時期」</font>を表示する
![bl_ss_170806_09.png](https://qiita-image-store.s3.amazonaws.com/0/67365/3cc5de9c-bdef-6ec9-a51b-5e5dccaef2b8.png)

###「4,アレルギーはありますか？」のラジオボタンで<strong>ある</strong>がチェックされていたときに<font color="MediumBlue">「アレルギーの原因」「症状」</font>を表示する
![bl_ss_170806_10.png](https://qiita-image-store.s3.amazonaws.com/0/67365/edb48e43-55b8-98cf-e435-c08a55c4c1d6.png)

###「5,これまで薬や駐車で具合が悪くなったことはありますか？」のラジオボタンで<strong>ある</strong>がチェックされていたときに<font color="MediumBlue">「詳細」</font>を表示する
![bl_ss_170806_11.png](https://qiita-image-store.s3.amazonaws.com/0/67365/3b5993cf-0709-72d3-5320-94e3665f3198.png)

##実際の動作
初期状態。
![bl_ss_170806_12.png](https://qiita-image-store.s3.amazonaws.com/0/67365/df8c39c0-c8f6-ee66-14b0-40b66aa16bee.png)

それぞれ選択をした状態。
![bl_ss_170806_13b.png](https://qiita-image-store.s3.amazonaws.com/0/67365/e5def8a0-0647-626f-0101-8d8ccb67ec04.png)

---
#このプラグインについて
・レコード一括更新 - [kintoneプラグイン『機能拡張スタンダード All-In』を使ってレコード一括更新を行う](http://qiita.com/spica/items/f0e84a1cf430670c4292)
・自動計算・自動採番 - [kintoneプラグイン『機能拡張スタンダード All-In』を使って自動採番を行う](http://qiita.com/spica/items/803af7cd540ae0b8f718)
・条件書式 - [kintoneプラグイン『機能拡張スタンダード All-In』を使って条件書式を設定。CSSも使ってみる](http://qiita.com/spica/items/24027003e9dfb9363819)
・フィールド属性 - [kintoneプラグイン『機能拡張スタンダード All-In』を使ってルックアップ編集や再利用指定などなど条件毎に設定する](http://qiita.com/spica/items/73107bda2cff4a94cf41)
・選択数制御 - [kintoneプラグイン『機能拡張スタンダード All-In』を使ってユーザー選択、複数選択などの選択数を制御する](http://qiita.com/spica/items/1c3ba3927b844b6bb72b)