はい、選択式で入力できるダイアログを表示する方法はあります。
「レコードの一覧をポップアップで表示する」で、別のアプリに用意した選択肢用アプリのレコードを表示することで実現できます。
一覧画面など、選択肢を選択させるためのフィールドを設置できない場面で役立ちます。
また、選択肢用アプリから複数の選択肢を表示する別の方法として、プルダウンを作る「フィールド値をレコードから選択するプルダウンを作成する」もあります。
この方法は次の記事でご紹介しておりますので、併せてご確認ください。
また、本記事の「フィールド値を追加・編集画面で選択して入力したい場合」でも簡単にご紹介しておりますので、併せてご覧下さい。
アプリのカスタマイズ例
カスタマイズは一覧画面に設定します。
一覧画面に「一括設定」ボタンを設置し、各レコードの左端にチェックボックスを配置します。
チェックボックスにチェックを入れて「一括設定」ボタンを押すと、「状態」フィールドにセットする値を選択するためのダイアログが表示されます。
「検収済」を選んでOKボタンを押すと、レコードが更新されます。
アプリの準備
今回は2つのアプリを準備します。
まず、選択肢を保存するために、次のフィールドを持つ「選択肢マスタ」アプリを用意しました。
選択肢マスタ
※フィールド名とフィールドコードは同じものを指定します
また、データは次のように登録しました。
想定として、この選択肢マスタは色々なアプリから使用される選択肢をまとめて管理しているアプリです。
選択肢種別は今回の「検収」のほかに例えば「入金」「支払」など、色々な選択肢項目があり、各アプリからはこの「選択肢種別」をキーにレコードを取得することで、ポップアップやプルダウンの作成に使用します。
更に、表示先での並び順を制御するための「並び順」フィールドも持っています。このフィールドは各アプリで、昇順に並び替える為に使います。
仕入アプリ
ポップアップを表示する側の「仕入」アプリは次のようになります。
フィールドは複数ありますが、今回のカスタマイズで使用するのはこちらのフィールドのみです。
※フィールド名とフィールドコードは同じものを指定します
Customineでのカスタマイズ
カスタマイズは、仕入アプリに行っていきます。
一覧画面を表示した時
まずは、一覧画面を表示した時のカスタマイズを行います。
やること「ボタンをメニュー位置に配置する」で一覧画面にボタンを表示します。
また、やること「一覧にチェックボックス列を追加する」でレコードの左端にチェックボックスを表示します。
条件は「一覧画面を表示した時」です。
「一括設定」ボタンが押された時
次に、「一括設定」ボタンが押された時のカスタマイズを作成していきます。
一覧に表示したチェックボックスでチェックされたレコードを取得するために、やること「一覧で選択されたレコードを取得する」を指定します。
こちらのアクションは、やること「一覧にチェックボックス列を追加する」を追加すると自動的に作成されますので、そのまま利用します。
ポップアップの表示準備
選択肢マスタアプリからレコードを取得し、ポップアップで表示するカスタマイズを追加します。
やること「キーを指定してレコードを取得する」で選択肢マスタアプリからレコードを取得します。この時キーとなるフィールドは「選択肢種別」を指定し、キーの値には「検収」を指定します。
そして取得した選択肢項目を並び替えるため、やること「レコードを並べ替える」を使用します。こうすることでポップアップで表示時の並び順を制御しています。
ポップアップの表示
これでポップアップ（ダイアログ）表示の準備が整いましたので、表示します。
ここでは、やること「レコードの一覧をポップアップで表示する」を使用します。
表示するレコードは、並べ替えを行ったアクション5番を指定し、「選択方法」は、今回は複数の選択肢から1つだけ選んでほしいので「単一選択（ラジオボタン）」を指定しています。「未選択を許可するかどうか」は「未選択の場合OKを押せなくする」を選びます。
次に、選択された選択肢をレコードにセットします。
やること「レコードをもとに別のレコードを更新する」を使用し、一覧のチェックボックスでチェックされたレコードである、アクション番号4のレコードを更新します。
マッピングは下記のように指定しています。
ポップアップで選択されたアクション6番のレコード中の、「選択肢名称」というフィールドの値をセットする内容です。
難しそうに見えるかもしれませんが、フィールドマッピングで挿入→他のアクションの結果と選ぶと下記の画面が表示されますので、一覧の中からフィールドを選べばマッピングの設定は完了です。
そして最後に忘れてはいけないのが、リロードです。
一覧画面や詳細画面でフィールドの値を変更しても、画面をリロードしなければ最新の値は表示されません。
ここでは、やること「画面をリロードする」を指定します。条件は、レコードの更新を行っているアクション7番が完了した時に設定します。
以上でカスタマイズは完了です。
「kintoneアプリへ登録」を行い、動作を確認してみてください。
なお、全体のカスタマイズは次のようになります。
思うような動きとならない時は、上のカスタマイズと合っているかどうか見比べてみてください。
フィールド値を追加・編集画面で選択して入力したい場合
ここでは、記事本文のカスタマイズで更新した「状態」フィールドについて、追加・編集画面で値を入力する場合に使用できる、プルダウンの作り方についてご紹介します。
表示される項目は、記事本文でポップアップしたものと同じように、選択肢アプリのレコードを使用して作成します。
こうすれば複数の方法で更新されても、「状態」フィールドに入力される値に一貫性を持たせられます。
完成例は次の通りです。
「プルダウン」で値を選択すると、状態フィールドにプルダウンで選択した値がセットされます。
カスタマイズについては、途中までは上記のカスタマイズと同じ流れになります。
レコードが取得できたら、レコードを元にプルダウンを作成します。
プルダウンの作成には、あらかじめkintoneアプリ側でスペースフィールドを配置しておく必要があります。今回は「仕入アプリ」の箇所でも記載していますが、スペースフィールドの要素IDは「status」としています。
その上でやること「フィールド値をレコードから選択するプルダウンを作成する」を使い、表示するスペースは「status」、レコードは並べ替え後の10番のレコードを指定します。
「kintoneアプリへ登録」すると、追加・編集画面で下記のようなプルダウンが表示されます。
以上で、プルダウンの作成は終了です。
全体のカスタマイズは次のようになります。
思うような動きとならない時は、上のカスタマイズと合っているかどうか見比べてみてください。
おわりに
今回はアプリのレコードを元にポップアップやプルダウンでの入力を実現するカスタマイズをご紹介しました。
なお、やること「テーブル行をレコードとして取得する」でテーブルをレコードに変換すればテーブルデータからでもポップアップやプルダウンを作成することは可能です。
ぜひ、色々と試してみてください。
Customineドキュメントやサポートページもぜひご活用ください。
また、ご不明点等ございましたら、チャットにてご質問ください！