kintoneでテーブルをルックアップする

今回は、ルックアップでテーブルを持ってくるというカスタマイズをしてみましょう。

アプリの準備

まずはルックアップされる側のアプリを作り、
それを再利用してルックアップする側のアプリを作ります。

ルックアップされる側

フィールド種類	フィールドコード	備考
文字列(1行)	テンプレート名	重複禁止
文字列(1行)	品名	テーブル内フィールド
数値	個数	テーブル内フィールド
数値	単価	テーブル内フィールド
計算	金額	個数*単価（テーブル内フィールド）

ルックアップされるデータの準備

以下の2件レコードを登録しておきます。

ルックアップする側

フィールド種類	フィールドコード	備考
ルックアップ	ルックアップ	ルックアップ設定は後述
文字列(1行)	テンプレート名	ルックアップでコピーする
文字列(1行)	品名	テーブル内フィールド
数値	個数	テーブル内フィールド
数値	単価	テーブル内フィールド
計算	金額	個数*単価（テーブル内フィールド）
計算	合計	SUM(金額)

JavaScript

kintone REST API Client を入れておきます。
https://unpkg.com/@kintone/rest-api-client@latest/umd/KintoneRestAPIClient.min.js

フィールド値変更時イベントではルックアップフィールドの変更を検知することができないので、
ルックアップで文字列(1行)（テンプレート名）を取得してきたのをトリガーにします。

kintone.events.on(
    [
      "app.record.create.change.テンプレート名",
      "app.record.edit.change.テンプレート名",
    ],
    (event) => {
      // レコード番号
      const rId = event.record.ルックアップ.value;
      if (!rId) { // クリアのとき消す用
        event.record.テーブル.value = [];
      } else { // ルックアップしてきた時用
        getTable(kintone.app.getLookupTargetAppId("ルックアップ"), rId);
      }
      return event;
    }
  );

  // async await は changeイベントでは使えないので外に出す。
  const getTable = async (appId, rId) => {
    const client = new KintoneRestAPIClient();
    const res = await client.record.getRecord({
      app: appId,
      id: rId,
    });
    // とってきた値をテーブルにセット
    const obj = kintone.app.record.get();
    obj.record.テーブル.value = res.record.テーブル.value;
    kintone.app.record.set(obj);
  };

こんな動きをします

あたかもテーブルがルックアップされているかのような動き！