kintone JavaScriptカスタマイズ Vol.1

初めに

最近、業務の中で「Kintone」に触れる機会がありました。
事前情報として私にはシステム開発等の経験はありません。
そんなプログラミング初心者の私が、「Kintone」のシステムカスタマイズを少しずつ行なっていく過程を、自身の備忘録的な意味も込めて記事にして発信していきます。

「kintone」って何？

一言で言うと、webデータベース型のビジネスアプリ構築クラウドサービスです。
「Kintone」の大きな特徴として、システム開発をした事がない人でも、簡単かつ直感的にシステム構築ができる事が挙げられます。
また、APIやプラグイン、JavaScriptなどを用いて比較的簡単にカスタマイズも行うことも可能です。

Kintoneとは？　https://kintone.cybozu.co.jp/

本記事の目的

本記事では、kintone JavaScriptカスタマイズを行う際の基本的な考え方を理解した上で、簡単な処理を行なっていきます。
今回エディターは、kintone内でJavaScriptの編集・保存が簡単に行えるプラグイン「JSEdit for kintone」を使用していきます。
JSEdit for kintone： https://developer.cybozu.io/hc/ja/articles/205452653

いざカスタマイズ！

今回は任意のアプリにおいて、「新規レコード作成画面で指定したフィールドのみを非表示にする」というカスタマイズをしていきます。
下の画像の赤丸の部分だけを非表示にするという処理です。

まず初めに、kintone JavaScriptカスタマイズを行なっていく上で基本となる考え方についてです。
kintoneにはイベントというものがあります。
イベント一覧：　https://developer.cybozu.io/hc/ja/articles/360000361686-kintone-JavaScript-API-%E3%82%A4%E3%83%99%E3%83%B3%E3%83%88-%E4%B8%80%E8%A6%A7

このイベントを発火点に、処理したい内容を記載していくという流れとなります。
今回は、「新規レコード作成画面を開いた時」を発火点にしたいので、app.record.create.show というイベントタイプを使用します。
このイベントですが見方はすごくシンプルで、「アプリのレコード作成画面を開いた時」という内容となっており、イベントコードを左から直訳して読んでいくとイベントの内容となります。

処理内容に関しても、developer network内に関数が既に用意されているので、そちらを使用していきます。
Kintone developer network ：https://developer.cybozu.io/hc/ja/articles/360015513211

それでは実際に書いていきます。

(function() {
    "use strict";
    kintone.events.on('app.record.create.show', function(event) {
        kintone.app.record.setFieldShown('文字列', false);
    })
})();

これまでの内容をもとに、上記のJavaScriptを日本語にしていくと、
「アプリのレコード作成画面を開いた時（イベント）」に「文字列というフィールドを非表示にする（処理）」という内容になります。
では保存をして、実際に処理内容が上手くいっているか確認してみます。

おお！非表示にしたかった「文字列」のみがきちんと非表示になっていますね。
処理がうまくいったようです。

まとめ

今回は、簡単なkintone JavaScriptカスタマイズをしてみました。
今回の内容を実際に使用するシーンとして、例えば、入力する項目（フイールド）が多いレコードの初回入力画面で、入力必須の項目以外は表示しないようにする。といった使い方ができそうです。
kintoneはこのように、ユーザーのこうしたい！を簡単に実装することができる小回りがきくクラウドサービスです。
次回以降は、もう少し実例に沿った処理をしていけたらと考えています。