別アプリ参照型の「動的ドロップダウン」プラグイン

別アプリのデータを直接ドロップダウンの選択肢として表示できるプラグインです。

ドロップダウン入力の課題

kintoneの標準機能にある「ドロップダウン」は、入力ミスを防ぎ、データの表記ゆれを防止するために非常に便利なフィールドです。しかし、ビジネスの現場で運用を続けていると、以下のような課題が浮き彫りになってきます。

① メンテナンスの二重手間

例えば、「商品マスタアプリ」で管理している商品名を、複数の「見積アプリ」や「受注アプリ」のドロップダウンで選択できるようにしている場合。新商品が追加されるたびに、すべてのアプリの設定画面を開き、ドロップダウンの選択肢を手動で更新しなければなりません。管理するアプリが増えれば増えるほど、この作業は膨大になります。

② 更新漏れによるデータの不整合

アプリの更新作業を忘れてしまうと、現場では「新しい商品がリストに出てこない」というトラブルが発生します。最悪の場合、古い商品名で入力されてしまったり、手書きの文字列入力で代用されたりすることで、正確な集計ができなくなるリスクがあります。

③ 選択肢が多すぎることによる操作性の低下

標準のドロップダウンは、すべての選択肢を表示します。商品数が数百、数千に及ぶ場合、目的の項目を探し出すだけで一苦労です。特定のカテゴリで「絞り込み」をかけることができないため、ユーザーの利便性を損なう原因となります。

解決策：何ができるか？

これらの課題を根本から解決するのが、今回ご紹介する「動的ドロップダウン作成プラグイン」です。

マスタアプリとの完全連動

このプラグインを使えば、別のアプリ（例えば商品マスタや棚番号マスタ）にあるレコードを、リアルタイムでドロップダウンの選択肢として取得できます。マスタアプリ側を更新するだけで、それを利用するすべてのアプリの選択肢が自動的に最新状態になります。

動的な絞り込み検索機能

「フォーム上の分類項目を選択したら、その分類に属するレコードだけをドロップダウンに表示する」といった動的な絞り込み検索機能を実現できます。この機能で膨大なリストから目的の項目探す手間を省き、誤入力の可能性をさらに低減させることが可能です。

プログラミング不要の簡単設定

通常、このような機能を実現するには複雑なJavaScriptカスタマイズが必要ですが、本プラグインは設定画面からマウス操作だけで導入できます。

プラグインの主な機能

本プラグインは、kintone UI Component（KUC）を利用して、kintoneの標準デザインのドロップダウンをアプリ上に配置します。このKUC版ドロップダウンは、ドロップダウンの設定プロパティをJavascriptで操作することが可能なコンポーネントです。

【機能のポイント】

• リアルタイム取得:
  レコード追加・編集画面を開いた際に、KUCドロップダウンに参照元アプリの最新レコードを読み込んでリスト表示します。複数のアプリで同じマスタを参照するドロップダウンが作成可能です
• 絞り込み検索機能:
  参照元マスタアプリのレコードをフォーム画面上の分類項目で絞り込み検索してドロップダウンに表示できます。この機能で必要なレコードだけをドロップダウンに表示して入力作業を効率化できます。
• 柔軟なソート機能:
  参照元マスタアプリ内の任意のフィールドを指定して、五十音順やコード順に並び替えて表示できます。
  昇順／降順の並び順も設定画面で指定可能です。

デモ画面

外部参照元アプリの「商品名」を、「商品種別」で絞り込んでドロップダウンに読み込みます。

実際に動作中の画面デモです。分類の選択を変更するとドロップダウンの値も変化します。

具体的な業務への活用事例

このプラグインを導入することで効果を発揮する、具体的な業務活用シーンをご紹介します。

① 見積書アプリの商品選択

• 活用法: 商品マスタを親アプリとし、見積アプリや在庫移動アプリで商品を選択。
• メリット: 数千点の商品があっても、カテゴリ絞り込み（PC、周辺機器、文具など）を併用することで、現場の入力スピードが向上します。

② 担当者と顧客マスタの連動選択

• 活用法: 組織マスタから「部署」を選択すると、その部署に所属する「顧客マスタ」だけがドロップダウンに表示される。
• メリット: 全レコードから探す手間がなくなり、他部署の顧客を誤って選択するミスをゼロにします。

③ プロジェクトと工程管理

• 活用法: 進行中のプロジェクトマスタを参照し、日報アプリで「現在動いているプロジェクト」だけを選択肢に出す。
• メリット: 完了したプロジェクトを選択肢から自動で除外（マスタ側でステータスを絞り込む設定）できるため、古いデータへの入力を防げます。

④ 店舗・拠点別メニュー管理

• 活用法: 飲食店などで「店舗マスタ」を選択すると、その店舗限定の「メニュー」が表示される。
• メリット: 地域や店舗ごとに提供サービスが異なる複雑なビジネスモデルでも、アプリを分けることなく一元管理できます。

⑤ 顧客別単価・契約プランの表示

• 活用法: 取引先を選択すると、その会社と契約している「プラン一覧」だけを選択できるようにする。
• メリット: 契約外のサービスを入力してしまう事故を防ぎ、事務処理の正確性を担保します。

プラグインの設定方法

本プラグインの導入と設定前に、アプリのフォームに下記のフィールドを用意する必要があります。

• KUC版ドロップダウンを表示するスペース領域（スペースの要素IDは任意の値を設定）
• KUC版ドロップダウンの入力値保存用フィールド（文字列１行型）
  ※入力値保存用フィールドは、プラグイン制御でレコード新規登録・編集画面では「非表示」にします。

設定画面の構成

プラグインの設定は、kintoneの標準的な操作感を踏襲しており、下記の3ステップ構成になっています。

1. 外部参照元するアプリ設定

🔎外部参照元アプリを検索
　外部参照したい「マスタアプリ」を選択します。キーワード検索機能が付いているため、多数のアプリを作成している環境でも、目的のマスタをすぐに見つけられます。
外部参照元アプリ選択
　検索結果のアプリの一覧表から、目的の外部参照元アプリを選択します。
ドロップダウンに表示するフィールド（外部参照元）
　ドロップダウンリストに表示したい外部参照元アプリのフィールドを指定します。
並び替え表示のキーにするフィールド（外部参照元）
　ドロップダウンリストに表示する項目の並び替えに使用したい外部参照元のフィールドを指定します。
　並び替えの方向（昇順／降順）をラジオボタンで指定します。

2. 表示・保存先の設定（自アプリ）

表示するスペースID（自アプリ）
　KUC版ドロップダウンを表示するスペース要素IDを選択します。
保存先フィールドコード（自アプリ）
　外部参照したドロップダウンの値を保存するフィールド（文字列1行型）を指定します。

3. 絞り込み条件と並び替え

このセクションでは、ドロップダウに表示する項目を絞り込み検索する設定を行います。
なお、絞り込み検索に指定できるフィールド型は、ドロップダウン型とラジオボタン型のみです。
設定後に自アプリ側のフィールドの値を変更すると、ドロップダウンリストの値が変化します。
設定で「–指定しない–」を選択すると、すべてのレコードがドロップダウンに表示されます。
　設定例）検索キー項目（外部参照元）：商品分類　→　検索キーワード（自アプリ側）：分類名

試用版プラグインのお申込み

本プラグインの試用版（60日間）をご希望の方は、以下のフォームからお申し込みください。
お申込み者のＥメール宛に「試用版ダウンロードのご案内」をＥメールでご送付します。
★★ kintoneの「ドメイン名」は正確にご記入ください。★★

お問い合わせ・料金体系

本プラグインは、下記の料金プランで販売しています。
各プランの「お問い合わせ／お申込み」欄のボタンからお申込み、又はお問い合わせください。

年間契約は、1年間の利用権の購入です（継続して利用される場合は、毎年購入が必要です）
簡易サポート契約では、アプリテンプレートとプラグインを合わせて6種類までご利用できます。
会員サポート契約では、アプリテンプレートとプラグインの無制限利用＋運用ヘルプデスク対応付きです。

リリースノート

【名称】別アプリ参照型の「動的ドロップダウン」プラグイン

【概要】別アプリのデータを直接ドロップダウンの選択肢として表示できるプラグインです。

このプラグインで利用しているOSSのライセンスは以下の通りです。

参考記事

以下の記事は、”別アプリの値を参照する動的なドロップダウン設置“のカスタマイズ事例の紹介です。

別アプリの値を参照する動的なドロップダウンリストの設置

別アプリの値を参照する動的ドロップダウンリストの実装 もし、社内資産マスタなどの他アプリを参照できるドロップダウンリストが作れたら、ドロップダウンリスト側の保守が不要になります。 そこで、外部アプリのレコードを参照するドロップダウンリストのカスタマイズ事例を紹介します。

dejitora.jp

2024.05.13

---

#kintone #plugin #動的ドロップダウン #kintone UI Component