回答の条件によってグループフィールドの開閉を切り替える

フォローする

(著者:サイボウズ 三宅 智子)

Index

はじめに

2016年2月のアップデートで追加の「グループフィールド開閉API」を使ったJavaScriptカスタマイズをご紹介します。

このAPIを使うことで例えば、回答の条件によって、グループフィールドを開いたり閉じたりしたい!という要望にお応えできるようになります。
分岐のある入力項目がある場合に便利ですね。

今回ここでご紹介するのは、製品の要望を集めるアプリのラジオボタンの選択肢によってグループフィールドを制御できるカスタマイズです。

完成イメージ

設問「種類」のラジオボタンの選択肢によって開いておくグルーフィールドを設定できます。

 

実際には下のように動きます。

https://gyazo.com/a2ece947c6fe8fe6dc5b9e0463d9f580

 

サンプルアプリの準備

まずはアプリの準備をします。今回はkintoneアプリストアにある「製品評価箱アプリ」を使います。
ダウンロードした「製品評価箱アプリ」に必要なフィールドを追加して、フィールドコードを新たに設定します。

フィールドの設定

サンプルアプリのフィールドは以下です。製品評価箱アプリに元々設置されているフィールド以外に、下記のフィールドを付け足してください。

フィールド名 フィールドコード フィールドタイプ
不具合を選択された方 group_failure グループフィールド
要望を選択された方 group_demand グループフィールド
質問を選択された方 group_question グループフィールド
その他を選択された方 group_other グループフィールド

各グループフィールドの中には上の完成イメージ図や下図を参考に任意のフィールドを入れてみてください!

サンプルプログラム

ご注意事項
  • サンプルプログラムは、その動作を保証するものではありません
  • サンプルプログラムの技術的なサポート等は行っていません

プログラム(JavaScript)

「グループフィールド開閉API(kintone.app.record.setGroupFieldOpen)」を使って、まずアプリ内の全てのグループフィールドを閉じる処理をします。
そのあと、ラジオボタンの値によって開くグループフィールドを切り替えています。

使用したAPI

  1. イベントハンドラーを登録する
  2. レコード詳細画面が表示された時のイベント
  3. レコード追加画面が表示された時のイベント
  4. レコード編集画面が表示された時のイベント
  5. レコード追加画面のフィールド値変更イベント
  6. レコード編集画面のフィールド値変更イベント
  7. グループフィールドの開閉API

最後に

他にもアレンジして便利にお使いいただけそうでしょうか?
今回はラジオボタンの選択肢によってグループフィールド開閉を切り替えるというものでした。他にもプロセス管理のステータスによって切り替えるという利用シーンもありますね。
何かご不明な点などありましたらお気軽にコメントください!

デモ環境

https://dev-demo.cybozu.com/k/82/

※デモ環境についての説明はこちら

記事に関するフィードバック

直接的に記事と関連がないご質問はcybozu developer コミュニティをご活用ください。

ログインしてコメントを残してください。
Powered by Zendesk