前回の記事ではJavaScriptの書き方の初期宣言について見ました。
続いて、kintoneにおけるJavaScriptカスタマイズでは「レコード一覧画面を開いたとき」や「レコード追加保存前」などのイベント別に処理を定義できます。
この記事ではイベント別の書き方について解説します。
- kintoneのJavaScriptカスタマイズでは、イベント別に処理を定義できます。
- 複数のイベントに対して、一回の記述でまとめて処理を定義できます。
- 追加画面や編集画面では、フィールドの値を操作できます。
kintoneでは色々なイベントがあり、そのイベント別に行う処理を定義することができます。
どのようなイベントが用意されているかは以下をご覧ください。
イベント処理の記述方法 – cybozu developer network
たとえば、レコード一覧画面表示時のイベントでメッセージを表示させたい場合、「app.record.index.show」というイベントタイプに対して処理を記述します。
(() => {
'use strict';
kintone.events.on('app.record.index.show', event => {
alert('レコード一覧画面表示時イベント');
});
})()レコード詳細画面表示時のイベントでメッセージを表示させたい場合、「app.record.detail.show」というイベントタイプに対して処理を記述します。
(() => {
'use strict';
kintone.events.on('app.record.detail.show', event => {
alert('レコード詳細画面表示時イベント');
});
})()このように同じJavaScriptファイル内に分けて記述することもできますし、全く同じ処理をさせたいという場合は、イベントタイプをまとめて記述してプログラムを短くまとめることも可能です。
(() => {
'use strict';
kintone.events.on(['app.record.index.show', 'app.record.detail.show'], event => {
alert('レコード一覧画面・詳細画面表示時イベント');
});
})()このように[ ]でイベントタイプを括ります。
イベントタイプが一つだけの時も[ ]で括っても問題ありません。
行いたい処理に対しては関数（アロー関数）で定義します。
このときにeventを引数として指定します。
このeventの中には、イベントタイプや現在のレコードの情報などが含まれており、このレコード情報を参照したり書き換えたりすることが可能です。
たとえば、現在開いているレコードに「件名」というフィールドコードを持つフィールドがあるとします。
この件名をメッセージ表示させたい場合、下記のように「event.record.フィールドコード.value」という形で記述します。
(() => {
'use strict';
kintone.events.on('app.record.detail.show', event => {
alert(event.record.件名.value);
return event;
});
})()続いて、フィールドの値を書き換えたい場合、下記のように「event.record.件名.value」に代入する値を=で指定します。
(() => {
'use strict';
kintone.events.on('app.record.create.show', event => {
event.record.件名.value = 'お見積り依頼';
return event;
});
})()注意点として、イベント処理の最後には「return event;」を忘れず記述しましょう。
これが無いとレコードに値が反映されません。
また、event.record.件名.value = ”の形で値を書き換えられるのは、編集画面上のイベントのみです。
イベントタイプに「create」（追加時）や「edit」（編集時）が入ったイベントにしか対応していません。
「detail」（詳細画面）のイベントには対応していませんので注意しましょう。
「詳細画面や一覧画面からレコードの値を変更することはできないの？」と思われるかもしれません。
そんなことはありませんが、少し書き方のハードルが上がります。
REST APIという仕組みを使い、レコードの取得・登録・更新・削除が可能です。
REST APIを使った書き方については別の記事で紹介します。
- kintoneのJavaScriptカスタマイズでは、イベント別に処理を定義できます。
- 複数のイベントに対して、一回の記述でまとめて処理を定義できます。
- 追加画面や編集画面では、フィールドの値を操作できます。
cybozu developer networkで調べると沢山のイベントがありますね。
詳細画面上ではフィールドの値を変更できないなど、イベントによって使用できる操作が異なるため注意しましょう。
次回の記事ではフィールドの表示切替について解説します。
