# SweetAlert2処理がスルーされる

**URL:** <https://community.cybozu.dev/t/topic/643>\
**Category:** kintone 開発相談\
**Created:** [2017 年 12 月 15 日午前 8:02 UTC](https://community.cybozu.dev/t/topic/643 "2017-12-15T08:02:38Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Legacy\_Account2111](https://avatars.discourse-cdn.com/v4/letter/l/7c8e57/32.png) [@Legacy\_Account2111](https://community.cybozu.dev/u/Legacy_Account2111)\
**Post date:** [2017 年 12 月 15 日午前 8:02 UTC](https://community.cybozu.dev/t/topic/643/1 "2017-12-15T08:02:38Z")

</div>

お世話になっております。

&nbsp;

レコードの新規保存時にSweetAlert2を使用してメッセージを表示させたいと考えております。

保存ボタンを押した際、メッセージ画面は表示されますがメッセージの処理を待たずにレコードの保存処理が実行されてしまいます。

&nbsp;

コードは以下のようになっておりますが、どこを修正すればよろしいのでしょうか。

アドバイスなどいただけましたら幸いです。

==========================================

(function() {

“use strict”;

// レコード追加画面の保存前処理  
kintone.events.on(‘app.record.create.submit’, function(event) {

//確認ダイアログの表示  
swal({  
title: ‘テストタイトル’,  
text: ‘テストテキスト’,  
type: ‘warning’,  
showCancelButton: true,  
confirmButtonColor: ‘#3085d6’,  
cancelButtonColor: ‘#d33’,  
confirmButtonText: ‘はい’,  
cancelButtonText: ‘いいえ’,

}).then(function(isConfirm) {  
//「はい」を押した場合  
if (isConfirm) {  
swal(  
‘完了’,  
‘完了しました。’,  
‘success’  
);

//「いいえ」を押した場合  
} else if (isConfirm.dismiss === ‘cancel’) {  
swal(  
‘キャンセル’,  
‘キャンセルしました。’,  
‘error’  
);  
}

});

});  
})();

==========================================

&nbsp;

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1517](https://avatars.discourse-cdn.com/v4/letter/l/4bbf92/32.png) [@Legacy\_Account1517](https://community.cybozu.dev/u/Legacy_Account1517)\
**Post date:** [2017 年 12 月 15 日午後 12:54 UTC](https://community.cybozu.dev/t/topic/643/2 "2017-12-15T12:54:56Z")

</div>

y-kishi さん

[レコード追加画面の保存実行前イベント](https://community.cybozu.dev/hc/ja/articles/201941984#step2) の説明に下記があります。

・kintone.Promiseオブジェクトをreturnすると、非同期処理の実行を待つことができます。

ということで、Promise 処理すれば OK です。

&nbsp;

```
(function() {

"use strict";

// レコード追加画面の保存前処理
kintone.events.on('app.record.create.submit', function(event) {

return new kintone.Promise(function(resolve, reject) {

//確認ダイアログの表示
swal({
title: 'テストタイトル',
text: 'テストテキスト',
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'はい',
cancelButtonText: 'いいえ',

}).then(function(isConfirm) {
//「はい」を押した場合
if (isConfirm.value) {
swal({
title: '完了',
text: '完了しました。',
type: 'success',
}).then(function(result) {
resolve(event);
});

//「いいえ」を押した場合
} else if (isConfirm.dismiss === 'cancel') {
swal(
'キャンセル',
'キャンセルしました。',
'error'
);
resolve(false);
}

});

});
});
})();

```

---

<div class="post-metadata">

**Author:** ![Legacy\_Account2111](https://avatars.discourse-cdn.com/v4/letter/l/7c8e57/32.png) [@Legacy\_Account2111](https://community.cybozu.dev/u/Legacy_Account2111)\
**Post date:** [2017 年 12 月 19 日午前 8:12 UTC](https://community.cybozu.dev/t/topic/643/3 "2017-12-19T08:12:24Z")

</div>

rex0220 様

&nbsp;

ご回答いただきありがとうございます。

返信が遅くなり申し訳ございません。

&nbsp;

kintone.Promiseを使用したところ、無事メッセージの処理を待ってレコード保存の実行されました。

ただ、「いいえ」を押した際は「Uncaught (in promise) cancel 」といったエラーが表示され処理が中断されました。

今回は以下のように、successのメッセージに変更しました。

=============================================

return new kintone.Promise(function(resolve, reject) {

//確認ダイアログの表示  
swal({  
title: ‘テストタイトル’,  
text: ‘テスト本文’,  
type:‘success’,

}).then(function(result) {  
resolve(event);

});

});

=============================================

&nbsp;

エラーの原因はまた別の機会に対応したいと思います。

ありがとうございました。&nbsp;

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1574](https://avatars.discourse-cdn.com/v4/letter/l/76d3ee/32.png) [@Legacy\_Account1574](https://community.cybozu.dev/u/Legacy_Account1574)\
**Post date:** [2017 年 12 月 20 日午前 9:14 UTC](https://community.cybozu.dev/t/topic/643/4 "2017-12-20T09:14:26Z")

</div>

\>&nbsp;Uncaught (in promise) cancel

の原因は、元々のお話と同じ現象でPromiseのチェーンが保たれずにスルーされていることが原因かと思います。SweetAlert2のswal() は kintone.Promise() と同じくPromiseオブジェクトを返却する非同期処理の関数です。ですので、success時の書き方に揃えてあげれば良いと思います。

swal({

title: ‘キャンセル’,

text: ‘キャンセルしました。’,

type: ‘error’,

}).then(function (result) {

resolve(false);

});

&nbsp;

ちなみに、swal()がPromiseオブジェクトを返却するという特性を生かすと、次のような書き方もありかと思います。

&nbsp;

(function () {

“use strict”;

// レコード追加画面の保存前処理

kintone.events.on(‘app.record.create.submit’, function (event) {

//確認ダイアログの表示

returnswal({

title:‘テストタイトル’,

text:‘テストテキスト’,

type:‘warning’,

showCancelButton:true,

confirmButtonColor:‘#3085d6’,

cancelButtonColor:‘#d33’,

confirmButtonText:‘はい’,

cancelButtonText:‘いいえ’

}).then(function (isConfirm) {

//「はい」を押した場合

if (isConfirm.value) {

returnswal(

‘完了’,

‘完了しました。’,

‘success’

);

//「いいえ」を押した場合

} else if (isConfirm.dismiss === ‘cancel’) {

event=false;

returnswal(

‘キャンセル’,

‘キャンセルしました。’,

‘error’

);

}

}).then(function(){

returnevent;

}).catch(function(){

event.error=‘保存時にエラーが発生しました。’;

returnevent;

});

});

})();

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/cybozu/original/1X/d5c841c3c5a6cb66eed514001c1b45147c9e1f4f.png) [@system](https://community.cybozu.dev/u/system)\
**Post date:** [2024 年 10 月 31 日午前 5:05 UTC](https://community.cybozu.dev/t/topic/643/5 "2024-10-31T05:05:01Z")

</div>

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。