kintone devCamp Vol.10 ルックアップのことだけ、考えた。

ルックアップのことだけ、考えた。

1

2016.08.03サイボウズ株式会社

システムコンサルティング本部関西 SC グループ

萩澤 佑樹

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

• kintone ってアプリ間のデータ連携がクセあるなー

• いちいちカスタマイズでめんどくせーなー

• って方、挙手を !!

2

ところで

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu 3

先に謝っておきます。

ごめんなさい !!

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu 4

この資料では

頻出パターンの解決方法について逐次ググらなくても良いように

まとめました

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

なぜルックアップを使うのか

5

• たとえば kintone で案件管理システムを実現しようとして

• 要求されるデータモデルが以下のような ER 図だと

• kintone では各エンティティ ( 顧客、案件、日々の活動 ) をそれぞれ 1 アプリで作成する場合が多い

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

なぜルックアップを使うのか

6

• となると当然、子アプリでは親アプリのデータを利用してデータを作りたい ( なおかつ関連付けしたい )

• そういう場合に使うのがルックアップ

• 単純にルックアップの設定方法を知りたい人はこちら

便利に使おうガイドブックhttp://www.slideshare.net/cybozucommunity/kintonevol03

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

• CSV ファイル読み込み機能が若干使いにくくなる

• REST API でルックアップフィールドの値を更新するときはAPI トークン認証 (X-Cybozu-API-Token) は使えないのでパスワード認証 (X-Cybozu-Authorization) を使う

• JavaScript API の app.record.***.change.<fieldcode> 系イベントではルックアップフィールドの変更を捕捉できない

• JavaScript API の app.record.***.submit 系イベントではルックアップフィールドの値を扱えない

7

ルックアップ使うときの注意点

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

元々がデータコピー機能なので以下のケースでは要カスタマイズ

8

よく言われるパターン

2. ここを更新してもルックアップ先に値が同期されない

1. ここを変更したい

3. 絞り込み条件を変えたい

ルックアップのコピー先フィールドを入力可能に変更 !

1.

9

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

ルックアップフィールド使用時に

10

ここを変更したい

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

実は devnet に書いてる

11

つまり、新デザインは編集可能

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu 12

デモ

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

以下のレコード更新処理でルックアップフィールドを指定するとルックアップ元の値に戻ってしまう• REST API• CSV ファイル読み込み機能

13

このカスタマイズの注意点

ルックアップ元の値に戻ってしまう

ルックアップ元の変更時にルックアップ先の値も更新 !!

2.

14

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

ルックアップ元の変更時に

15

ルックアップ元の値を変更したけど

社員名簿アプリ

人事評価管理アプリ

コピー先フィールドは更新されない

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu 16

REST API でルックアップを一括更新

社員名簿アプリ 人事評価管理アプリ

JavaScript カスタマイズで• JS API の保存イベントで• 値の変更有無を確認し• 変更されていればルックアップ先

を一括更新

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

• 第 11 回 REST API を利用したレコード更新https://cybozudev.zendesk.com/hc/ja/articles/204537310

• ルックアップ先が更新されてもルックアップ元が更新されないhttps://kintoneapp.com/blog/lookup_improvement/※ サイボウズスタートアップス株式会社のブログ記事です。

17

JavaScript コードはこちらを参考に

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

分からなければ購入というのも手http://qiita.com/rex0220/items/573c462117ad4104c2cd

18

プラグイン

自作ルックアップ !!!( 複数のワードの AND 条件で検索 )

3.

19

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu 20

デモ

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu

• 自作ルックアップ用のフィールドが若干冗長• ただ、それ以外は搭載されている API を使用している (DOM 操作

等が無い ) のでアップデートによる影響は受けにくい

21

このカスタマイズの注意点

URL: https://cybozudev.zendesk.com/ © 2016 Cybozu 22

ルックアップで手の行き届かない点を解消するためには、

カスタマイズで乗り越える !!

まとめ