本格的にJavaScriptを触ってる人はともかく、
kintoneで初めてJavaScriptを始めるよって人には
「REST API」だの「kintone API」だの、まだるっこしいものである。
「つべこべ言わずに、動くソースをくれよ」
そんな意見があって、当然だと思う。
というわけで、
・「アプリID=11」のレコードを、「レコード番号の降順」で取得する
・取得結果をアラート表示させる
上述の簡単なサンプルコードをこさえた。
当該ソースはそのまま拡張子「js」で保存して
kintoneの「JavaScript / CSSでカスタマイズ」で
アップロードしてくれても正常に挙動する見込みである。
●サンプルコード
(function () {
"use strict";
// 適当なイベントから呼び出す
kintone.events.on('app.record.detail.show', function (event) {
//アプリID「11」のレコード内容をアラート表示する
alert(getRecords(event, 11));
return event;
});
//指定したappIDのレコードをレコード番号の降順で取得する
function getRecords(event, appID) {
// 戻り値の設定
var resp;
// URLを設定する
var appUrl = kintone.api.url('/k/v1/records', true)
+ '?app=' + appID
+ '&query=' + encodeURI('order by レコード番号 desc');
// レコードを取得
try {
var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET", appUrl, false);
xmlHttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
xmlHttp.send(null);
if (xmlHttp.status == 200 && window.JSON) {
resp = JSON.parse(xmlHttp.responseText);
}
} catch (e) {
}
return resp;
}
})();
●解説"use strict";
// 適当なイベントから呼び出す
kintone.events.on('app.record.detail.show', function (event) {
//アプリID「11」のレコード内容をアラート表示する
alert(getRecords(event, 11));
return event;
});
//指定したappIDのレコードをレコード番号の降順で取得する
function getRecords(event, appID) {
// 戻り値の設定
var resp;
// URLを設定する
var appUrl = kintone.api.url('/k/v1/records', true)
+ '?app=' + appID
+ '&query=' + encodeURI('order by レコード番号 desc');
// レコードを取得
try {
var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET", appUrl, false);
xmlHttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
xmlHttp.send(null);
if (xmlHttp.status == 200 && window.JSON) {
resp = JSON.parse(xmlHttp.responseText);
}
} catch (e) {
}
return resp;
}
})();
・最初の二行
何も考えずに記入する
・kintone.events.on(A,B);
イベントハンドラ。kintone上でAの操作が行われた時、
それをトリガーにして関数Bを動かしてね、という記述。
・'app.record.detail.show'
詳細画面表示時、というイベント指定。
他にもいろいろある。詳しくは「JavaScript API(イベント)」
・function (event) {処理}
関数。今回の場合は「詳細画面表示時」に動く実処理部。
・appUrl
アプリのURL。アプリIDとクエリ(WHERE句以降)を指定する。
複数レコードの操作なら'/k/v1/records'、1件の操作なら'/k/v1/record'を指定する。
kintoneアプリは「1アプリ=1テーブル」なので、
アプリのURLさえあればテーブルを指定したことになるんだね。
・XMLHttpRequest
URLからデータを読み出すためのオブジェクト。
私にとっては「同期処理のデータ送受信」を
叶えてくれる優秀なオブジェクト。
「え、今どき、非同期でしょ?処理早いし^^」
って言うかもしれないけどさ。
データ取得は同期処理じゃないとまったく意味が無いし、
データ更新だって「更新に成功したらこの処理、失敗したら…」
みたいな制御はいくらでもするでしょ?
ま、細かい話は専用のホームページを漁っておくれ、
私はよく知らんまま使っているがね。
・xmlHttp.open("GET", appUrl, false);
指定したデータ(appURL)の内容をGET(取得)したいよ、
なお、処理に失敗しても落ちないで次の処理に進んでね(false)
という約束の取り交わし。
・xmlHttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
通信時(HTTP要求時)に送るヘッダ。
'X-Requested-With'が名前で、'XMLHttpRequest'が値。
これを指定しないとブラウザによっては通信に失敗するらしい、
要は「盲目的に書いておくべきお約束文」。
・xmlHttp.send(null);
通信、はじめます。
・if (xmlHttp.status == 200 && window.JSON) {
HTTPステータスが200(正常)で
ちゃんとJSON形式だったら、
データを受け取っておきましょうかね、という、
これもお約束ごとのような一文。
elseで失敗時の挙動を書いておくとデバッグしやすいかも。