cybozu developer network

カテゴリー内の他の記事

自動ルックアップで名入れレコードを作る

概要

社内申請系のkintoneアプリでは、本人が申請することが多いため、レコードを追加する時から自分の名前が入ってたらなと思うことはありませんか?

そこで今回は、レコード追加時に、社員情報マスタなどの他のアプリから自分の氏名をルックアップしてセットするカスタマイズをご紹介します。

一言で表すと「自動ルックアップ」です!

まずルックアップのボタンを押して、次に [ユーザーを選択]画面で自分を選択して…という2アクションが一気に省けます。

完成イメージ

[+]ボタンを押して新しいレコードを追加する時、ルックアップフィールドに自分の名前が既にセットされています。

211429603_______.gif

実装の概要

実装イメージ

今回の実装のイメージです。動作上は標準機能のルックアップと類似していますが、実際はJavaScriptでこのような処理を行っています。

実装の流れ

  1. レコード追加イベントで、REST APIを使用し、ログイン名をキーにルックアップ先のアプリのレコード情報をリクエスト
  2. キーに合致したレコード情報を1件取得
  3. 取得したレコードの値をルックアップフィールドにセット
  4. ルックアップフィールドのlookupプロパティに trueを設定し、ルックアップを自動で取得

アプリの準備

マスタアプリの設定

ルックアップ先のレコードが入るマスタ用のアプリを用意します。
今回はログイン名をキーとして合致したレコード情報を取得します。ログイン名の他にマスタから取得したいフィールドを設定しましょう。今回は、[社員番号]と[氏名]を設定します。

フィールド名 フィールドタイプ フィールドコード 備考

社員番号

文字列(一列)

社員番号

「値の重複を禁止する」を設定※

氏名

文字列(一列)

氏名

 

ログイン名

文字列(一列)

ログイン名

 

※ 今回のカスタマイズは、ルックアップの取得を自動で行うようにしています。
「コピー元のフィールド」で選択したフィールドについて、既存のレコードの値が重複する場合は自動取得できません。
そのため「コピー元のフィールド」で選択したフィールドの設定で、「値の重複を禁止する」に設定しています。

マスタができたら、ルックアップ先のレコードを追加するのをお忘れなく!
ログイン名がキーになるため、正確に記載しましょう。

フォームアプリの設定

フォーム用のアプリを用意します。
ルックアップフィールド[社員番号]で先ほどのマスタアプリとの関連付けを以下のキャプチャのように設定します。なお、キーとなるログイン名についてはkintone APIで取得できるためアプリでのフィールド設定は不要です。

フィールド名 フィールドタイプ フィールドコード 備考

社員番号

ルックアップ

社員番号

 [ほかのフィールドのコピー]で[氏名] < [(マスタアプリ名の[氏名] ]

氏名

文字列(一列)

氏名

 -

-(なし)

スペース

error_display_field

エラーメッセージ表示用スペースフィールド

 

サンプルプログラムと解説

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

プログラム(JavaScript)

ポイント解説

ルックアップフィールドへの値セット

  • REST APIで取得したルックアップ先のレコードの値(今回は社員番号)を、ルックアップ元にセットし、それでもってルックアップを実行しています。
  • それにより、申請者により社員番号を勝手に書き換えられることのないアプリ設計になっています。

エラー処理

  • マスタに該当のレコードが見つからない場合は、その旨を画面に表示します。

  • エラー表示は、そのままだと、その後あらためて手動でルックアップに成功しても残ってしまいます。
  • そこでフィールド変更時イベントを利用して、ルックアップで値がコピーされた際はクリアするようにしています。

使用したAPI

    1. イベントハンドラーを登録する
    2. レコード追加画面が表示された時のイベント
    3. ルックアップフィールドの参照先のアプリIDを取得する
    4. ユーザー情報の取得
    5. レコードの一括取得(クエリで条件を指定)
    6. レコードの値を取得する
    7. レコードに値をセットする
    8. ルックアップの取得を自動で行う
    9. レコード追加画面のフィールド変更時イベント
    10. スペースフィールドの要素を取得する

終わりに

このカスタマイズのメリットは、2アクションが省けるのはもちろん、他のアプリで同様にマスタを参照するアプリでも、同名のフィールドコードでルックアップを設定しておけば、同じコードのコピペで簡単に設定できるところです。

手近なところではアプリストアにあるワークフロー(社内申請管理)パック(よく使う3つの社内申請管理のセット)と社員名簿の連携でも便利にお使いいただけるかと思います。ぜひ開発ライセンスを申し込んで試してみてくださいね。

関連付けしたアプリのレコード情報を自在に取得できますので、例えば休暇申請アプリに関連付けた有給休暇管理アプリから、自分の氏名と残有給休暇日数を同時に表示したレコードなんてのも作れそうです。ご活用ください!

このTipsは、2022年7月版で確認したものになります。

デモ環境

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

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

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

記事のコメント欄は記事に対するフィードバックをする場となっております。
右の記事フィードバックのためのガイドを参照してコメントしてください。
記事のリンク切れなど、気になる点がある場合も、こちらのフォームからフィードバックいただけますと幸いです。

Avatar
yumi0325

kintoneカスタマイズ初心者です。

こちらのカスタマイズを流用し、社内用にプログラミングしてみましたがうまく動きません。ご確認いただけないでしょうか?

『レコード追加画面のフィールド値変更時イベントの際、ルックアップコピーフィールドの値を取得し、その値をもう一つのルックアップフィールドにセットし、ルックアップを実行』※2種類のルックアップフィールド

--------------------

(function() {
"use strict";
var events1 = ['app.record.create.change'];
kintone.events.on(events1, function(event) {
var record = kintone.app.record.get();
// フィールドコード"ID"のレコードオブジェクトを取得
var fieldRecords = event.record.ID.value;

// 取得したレコードの値をルックアップ元にセット
setRecord['fieldRecords']['ルックアップ2']['value'] = ['ルックアップ2']['value'];
// セットした値でルックアップ実行
setRecord['fieldRecords']['ルックアップ2']['lookup'] = true;
kintone.app.record.set(setRecord);
// マスタに該当レコードがなかった場合のエラー表示
}else {
var errorDisplayField = kintone.app.record.getSpaceElement('error_display_field');
errorDisplayField.parentNode.style.width = '250px';
// 文字列要素
var errorDisplayDiv = document.createElement('div');
errorDisplayDiv.style.backgroundColor = '#ffd78c';
errorDisplayDiv.innerHTML = '該当データがありませんでした。';
errorDisplayField.appendChild(errorDisplayDiv);
}
});
}
});
// 手動ルックアップ時はエラー表示クリア
var events2 = ['app.record.create.change.都道府県'];
kintone.events.on(events2, function(event) {
var record = event['record'];
if (record['都道府県']['value'] !== null) {
var errorDisplayField = kintone.app.record.getSpaceElement('error_display_field');
if (errorDisplayField !== null) {
errorDisplayField.innerHTML = null;
}
}
return event;
});
})();

------------------------------------

お手数をおかけします。ご教授お願いします。

 

Avatar
cybozu Development team

yumi0325様

いつもお世話になっております。
cybozu developer network事務局です。 

ソースコードを拝見しました。

構文の間違いが何箇所かあるようですので、そちらをご確認いただければと思います。
・ > var events1 = ['app.record.create.change'];
 events2 のほうでは、changeの後ろに、フィールドコードを記載いただいていますが、
 events1 のほうでは、フィールドコードがありませんでした。
・ } else { とありますが、条件分岐の if がありませんでした。
・> setRecord['fieldRecords']['ルックアップ2']['value'] = ['ルックアップ2']['value'];
 セットしようとしている、setRecordの変数の宣言がさせていませんでした。
  ➡ サンプルでは、「var setRecord = kintone.app.record.get();」のように宣言しています。

最初は、記事のサンプル通り試していただいたり、はじめてのkintoneカスタマイズを試して
いただくと、わかりやすいかと思います。

また、動かない場合は、デバッグしていただくと、どこでエラーが起こっているのかが、
突き止められると思います。
こちらも是非、ご活用ください。

・動かない?そんな時はデバッグをしてみよう!入門編
https://developer.cybozu.io/hc/ja/articles/207613916

よろしくお願い致します。

Avatar
yumi0325

cybozu developer network事務局

ご担当者様

いつもお世話になっております。

早速ですが、構文違いの件、ご指摘ありがとうございます。

ご提案いただいた通り、最初はサンプル・初めてのカスタマイズも試し有る程度理解してから始めたつもりでしたが、

数か所構文違いとのこと、ご指摘いただいた内容を確認の上、再度カスタマイズしてみます。

よろしくお願いします。

 

 

 

Avatar
rina

初めまして。

こちらは氏名のみが取得されていますが、もし自動ルックアップで取得したい値が複数の場合は

どのようにすればよいでしょうか。

教えてくだされば幸いです。よろしくお願いいたします。

Avatar
cybozu Development team

rinaさん

初めまして。ご質問いただきありがとうございます。

ここでは氏名のみ取得していますが、マスタアプリにデータがある他の値も一緒に自動ルックアップで取得することが可能です。
簡単ですが、設定方法を記載させていただきます。ご参照ください。

1. 記事内の[フォームアプリの設定]欄の画像を見ていただくと、ルックアップの設定をしているのがわかると思います。
[ほかのフィールドのコピー]のところで氏名のみ指定していますが、ここで追加で取得したいフィールドについても選択します。

2. コード内の「// 手動ルックアップ時はエラー表示クリア」処理部分に氏名だけでなく、追加で取得するフィールドの条件も追記します。

ご確認よろしくお願いします。

 

Avatar
Daisuke Iio

これって

ユーザー選択の入力フォームで

初期値を「ログインユーザー」にする際との違いはなんでしょう?

kintone使用ユーザーと社員名簿のユーザー数が異なる場合は

効果的なようですが、

kintone利用ユーザーと社員が同内容の場合だと

ユーザー選択フォームの楽に思えますが。

 

kintone初心者なので、「こっちのほうが便利」っていう点があれば

教えていただきたく。よろしくお願いします

 

 

 

Avatar
ダン吉

ユーザー選択との違いですが、一番大きなメリットとしては、マスタの他のデータも引っ張ってこられるということだと思います。

ログイン名をキーにして、たとえば参照先の氏名やよみがななど他の情報もマスタ内にあれば一緒に自動取得ができます。

Avatar
枯れ木

初めまして。

kintoneに触れまだ数カ月、最近ようやくスクリプトにチャレンジし始めた超が付くくらいの初心者です。

勉強のつもりで上記サンプルAPとスクリプトを使い試してみましたが、うまくいきません。

デバッグを見たところ6行目で「Uncaught TypeError : Cannot read property 'value' of underfained」というエラーが発生しているようです。

どうすれば、改善しますか?

低能な質問でごめんなさい。

枯れ木により編集されました
Avatar
cybozu Development team

枯れ木 様

ご質問ありがとうございます。

エラーからすると、フィールドコードが間違っているようですね。
フォーム設定画面で、社員番号というフィールドのフィールドコードをご確認いただけますでしょうか。

cybozu Development teamにより編集されました
Avatar
枯れ木

cybozu Development teamの皆様

お世話になります。

ご指摘の箇所を確認すると、やはりフィールドコードが誤っておりました。

初歩的な確認不足でした。情けないです。

その後、改めて試したところ、無事問題なく作動いたしました。

ありがとうございました。

これを参考に、様々なAPに仕込んでいきたいと思います。

 

Avatar
cybozu Development team

枯れ木 様

いえいえ、とんでもないです。

うまく動いてよかったです。

Avatar
iwak

初めまして。

今回のサンプルの場合、キーは、kintoneのログイン名となっていますが、

キーをフォームアプリの任意のフィールドに設定することはできますでしょうか?

Avatar
cybozu Development team

iwakさん

コメントありがとうございます。cybozu developer network運営事務局です。

他のフィールドをルックアップのキーにしていただくことも、もちろん可能です。
ただしルックアップのキーフィールドに設定できるものには制限があるので、ヘルプをご参照ください。
https://jp.cybozu.help/ja/k/user/set_lookup

Avatar
iwak

cybozu Development teamの皆様

ありがとうございます。
ちなみに、ルックアップのキーではなく、①リクエストのキーを変えることはできますでしょうか?
今回はログイン名を指定していると思うのですが、それを、任意のフィールドにすることはできるのでしょうか。

https://jp.cybozu.help/ja/k/user/set_lookupの話でいきますと、ルックアップのキーの設定の話ではないかと思っていまして、
このAPIでいう、社員番号の話と認識しておりますがあっていますでしょうか?

Avatar
cybozu Development team

iwakさん

リクエストのキーとなるフィールドが、ルックアップ先のアプリで重複禁止のフィールドとなっていればTips上で指定しているフィールド以外も指定可能かと思います。

これでお答えになっていますでしょうか?

Avatar
iwak

ありがとうございます。

その答えで大丈夫です。
その場合、
'query': 'ログイン名 = "' + user.code + '" order by $id desc limit 1'
を書き換えればよいでしょうか?どのように書き換えればよいでしょうか?

Avatar
cybozu Development team

iwakさん

そうですね。query指定箇所をログイン名ではなく、任意のフィールド名に変更する形になります。

またルックアップ元も変わると思うので、以下の箇所も変更が必要です。

// 取得したレコードの値をルックアップ元にセット
setRecord['record']['社員番号']['value'] = resp['records'][0]['社員番号']['value'];
// セットした値でルックアップ実行
setRecord['record']['社員番号']['lookup'] = true;
kintone.app.record.set(setRecord);
Avatar
iwak

cybozu Development teamの皆様

ありがとうございます。
カスタマイズ初心者なので初歩的な部分を教えていただきいのですが、
メールアドレスフィールドを①のキーにする場合、

'query': 'ログイン名 = "' + user.code + '" order by $id desc limit 1'

はどのように変更すればよいでしょうか?

Avatar
cybozu Development team

iwakさん

こちらのページユーザー情報の取得が参考になるかと思います。

本記事では、ログイン名の「code」を取得していますが、ご質問メールアドレスの場合は上記の記事に記載のあるとおり「email」になります。

よろしくお願いいたします。

Avatar
iwak

cybozu Development teamの皆様

ありがとうございます。
設定をしてみます。

また何かありましたら、どうぞよろしくお願いいたします。

Avatar
cybozu Development team

iwakさん

もし記事の記載に直接関係ないことでわからないことがありましたら、コミュニティにプログラム初心者向けのフォーラムもございます。

コミュニティでわからないことを質問すると、有志が回答してくださいます。是非、ご活用ください!!

Avatar
Riorio

ものすごく初心者です。

よろしくお願いいたします。

この内容に非常に近いようで違うような気もするのですが

すでにapi連携でルックアップフィールドに入っている値を

自動で取得したいのですが(すでに値の入るルックアップフィールドは三つ存在することになります)、

応用でできる範疇なのか、またはこれとは別物なのか教えてもらいたいのですが

よろしいでしょうか?

 

Avatar
cybozu Development team

Riorio様

こちらの記事は、ルックアップを自動実行して値を入力するシナリオです。

いただいたお話では、すでにルックアップフィールドに入っている値を取得するシナリオでおそらく別の話になりますので、

コミュニティの方で相談いただければ幸いです。

その際、もう少しアプリ構成や要件を詳しく書かれたほうが返答がつきやすいと思いますので、よろしくお願いいたします。

Avatar
Riorio

cybozu Development teamさま
ご連絡ありがとうございます。
違うジャンルとのこと、かしこまりました。
無事できました。
ありがとうございました、

サインインしてコメントを残してください。