環境
- kintone
- javascript
- jQuery
- SweetAlert2
対象
- kintoneの保存時(submit)にSweetAlert2を使って保存させるか選ばせたい人
通常の書き方(ダメなパターン)
通常は以下の様な書き方になると思います。
kintone.events.on(
["app.record.create.submit", "app.record.edit.submit"],
(event) => {
Swal.fire({
title: "保存",
text: "保存処理を続けますか?",
icon: "warning",
showCancelButton: true,
confirmButtonColor: "#3085d6",
cancelButtonColor: "#d33",
confirmButtonText: "保存する",
cancelButtonText: "保存しない",
}).then((result) => {
if (result.isConfirmed) {
console.log('保存する が押されました。');
return event;
} else {
console.log('保存しない が押されました。');
return false;
}
});
この場合、保存処理が先に動いてしまい保存か保存させないかを選ぶ前に保存されてしまいます。
そのため以下の様に非同期処理を制御するためにPromiseを使用します。
Promiseを使用した書き方
以下の様にします。
kintone.events.on(
["app.record.create.submit", "app.record.edit.submit"],
(event) => {
return new kintone.Promise((resolve, reject) => {
Swal.fire({
title: "保存",
text: "保存処理を続けますか?",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: "#3085d6",
cancelButtonColor: "#d33",
confirmButtonText: "保存する",
cancelButtonText: "保存しない"
}).then((result) => {
if (result.isConfirmed) {
console.log("保存する が押されました。");
resolve(event);
} else {
console.log("保存しない が押されました。");
reject("cancel");
}
});
}).then((r) => {
return r;
}).catch((e) => {
return false;
});
});
kintone.Promiseの説明資料