kintone JavaScript API を使ってみよう

目次

kintone JavaScript API とは

kintone JavaScript API は、ブラウザーの画面上の情報を取得・操作できる API です。

kintone には独自のメソッドが複数用意されており、さまざまな情報が取得できます。

kintone.events.on()

JavaScript では、 addEventListener() を使ってイベントと関数を紐付けます。
kintone には独自のイベントがあり、その独自イベントと関数を紐付けるために kintone.events.on() を利用します。

JavaScript kintone JavaScript API
イベント click,change など app.record.create.show など
イベントと関数の紐付け addEventListener(イベント, 関数) kintone.events.on(イベント,関数)

kintone でイベントと関数を紐付けるには、次のように書きます。

1
2
3
kintone.events.on('app.record.create.show', (event) => {
  // イベントで行いたい処理を書く
});

kintone のイベントオブジェクト

kintone のイベント発生時の情報が格納されたオブジェクトです。
kintone のイベントと紐づけられた関数の引数で受け取ることができます。

1
2
3
4
kintone.events.on('app.record.create.show', (event) => { // この「event」がイベントオブジェクト
  event.record['加工したいフィールドコード'].value = '加工したい内容';
  // ~~~
});

kintone のイベントオブジェクトを return する

関数内でイベントオブジェクトを加工した後 return することで、加工内容を kintone に反映できます。

1
2
3
4
kintone.events.on('app.record.create.show', (event) => {
  event.record['加工したいフィールドコード'].value = '加工したい内容';
  return event; // return することで加工内容が反映される
});

イベントオブジェクトできること

イベントオブジェクトを取得・操作することで、次のことができます。

  • フィールドの値を書き換える。
  • フィールドの編集可/不可を設定する。
  • フィールドにエラーを表示する。
  • レコードにエラーを表示する。
  • 変更されたフィールド、テーブル内の行オブジェクトを取得する。
  • ルックアップを自動取得する。
  • ルックアップのコピー先のフィールドの値を自動でクリアする。

よく使う kintone JavaScript API

kintone.app.getId()

kintone.app.getId() は、開いているアプリの ID を取得するメソッドです。
kintone REST API でアプリ ID を指定するときなどに利用します。
直接 ID を指定すると、環境やアプリが変わったときにコードの書き直しが必要です。
しかし、このメソッドを利用すればその手間を省くことができます。

kintone.getLoginUser()

kintone.getLoginUser() は、ログインユーザーの情報を取得するメソッドです。
ログインユーザーのログイン名や表示名、メールアドレスなどを取得できます。
イベントオブジェクトの操作と組み合わせることで、「ログインユーザーに応じた情報を表示する」といったカスタマイズが可能になります。

kintone.app.getHeaderMenuSpaceElement()

kintone.app.getHeaderMenuSpaceElement() は、アプリ詳細画面でメニューの上側の空白部分の要素を取得するメソッドです。
「取得した要素にボタンを配置する」といったカスタマイズが可能になります。

まとめ

今回は kintone JavaScript API について学びました。
kintone 独自のメソッドを理解して書けるようになりましょう。

次回は、 レコード画面に任意のテキストを表示してみよう です。
よくあるカスタマイズのサンプルコードを通して、カスタマイズのポイントを学んでいきましょう。