ステータスの一括変更について

背景・実現したいこと

複数レコードのステータス変更処理中にメッセージを表示し、終了したら完了したメッセージを表示したいです。

下記コードにて、特定のステータスのレコードをボタンクリックで一括で次のステータスへ変更しようとしていますが、処理途中で画面遷移すると途中で処理が終わってしまいます。

変更しますか→OK選択→処理中です→処理が完了しました

のような順で、処理中のメッセージと、終了したら終了したメッセージを表示することはできますでしょうか

 

利用したソースコード

(function () {
"use strict";
var events = [
'app.record.index.show'
];
kintone.events.on(events, function(event) {
  // ボタン設置
  // ボタン増殖防止のため、ボタンがあるか確認
  if (document.getElementById('my_index_button') !== null) {
    return;
  }
  // ヘッダーメニューにボタン追加
  var myIndexButton = document.createElement('button');
  myIndexButton.id = 'my_index_button';
  myIndexButton.innerText = 'ステータス一括変更';
  kintone.app.getHeaderMenuSpaceElement().appendChild(myIndexButton);
  // onclickを設定
  myIndexButton.onclick = function(){
    // 変更の確認ウィンドウ
  var flag = confirm('ステータス「A」のレコードをすべて「B」に変更します');
    if(flag == true){
        // Aのレコードを取得
        // リクエストボディ
        var body = {
            'app': kintone.app.getId(),
            'query': 'ステータス = "A" order by 更新日時 asc limit 500',
            'fields': ['レコード番号', 'ステータス']
        };
        // レコード取得
        kintone.api(kintone.api.url('/k/v1/records.json', true), 'GET', body,function(resp) {
            // success
            // JSONオブジェクトに変換
            var records_obj = JSON.parse(JSON.stringify(resp));
            // 取得したレコードを1つずつアクション実行
            for (let i = 0; i < records_obj.records.length; i++){
            var body2 = {
                'app': kintone.app.getId(),
                'id': records_obj.records[i].レコード番号.value,
                'action': 'ステータス変更',
            };
            kintone.api(kintone.api.url('/k/v1/record/status.json', true), 'PUT', body2,function(resp) {
                // success
                console.log(resp);
            },function(error) {
                // error
                console.log(error);
            });
            }
            alert(records_obj.records.length + '件のレコードを「B」に変更しました');
        },function(error) {
            // error
            console.log(error);
        });
    }
    else{
        alert('処理を中止しました');
    }
}
return event;
});
})();

更新処理中はスピナー(更新中のぐるぐる)を表示するなどいかがでしょうか??

https://developer.cybozu.io/hc/ja/articles/204528874-spin-js-%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%A6-%E3%82%B9%E3%83%94%E3%83%8A%E3%83%BC-%E3%83%AD%E3%83%BC%E3%83%87%E3%82%A3%E3%83%B3%E3%82%B0%E3%82%A2%E3%82%A4%E3%82%B3%E3%83%B3-%E3%82%92%E8%A8%AD%E5%AE%9A%E3%81%97%E3%82%88%E3%81%86-

juridon

ご教示ありがとうございます。

一度試してみます!