javascript - jquery uiダイアログが予期せず閉じました

Question

jquery-uiを使用してインタラクティブなキャンセルボタンダイアログを実装する予定です。ユーザーが [キャンセル] をクリックすると、ポップアップ確認ダイアログが表示されます。ユーザーが [はい] をクリックすると、応答ステータスに基づいて応答します。これが私がコードを実装した方法です。

function refreshPage() {
window.location.reload(true);
}

$(function() {
setTimeout(refreshPage,30000);

var cancelJob = function(e) {
    e.preventDefault();
    $('.hiddenCancelPopup').dialog({
        modal: true,
        buttons: {
            "Yes": function() {
                var bookingJobNo = $('.cancelButton').attr("rel");
                var channel = $('.cancelButton').attr("channel");
                var deviceId = $('.cancelButton').attr("deviceId");
                if(readCookie("mbtx_session_id") == null) {
                    $(".invalidId").dialog({});
                    return;
                }
                jQuery.get('/rest/v2/booking/cancel/'+  bookingJobNo + "?channel=" + channel + "&deviceId=" + deviceId,  function(result) {
                    if(result.status == 501) {
                        $(".hiddenCancelledPopup").dialog({
                            modal: true,
                            buttons: {
                                "OK": function() {
                                    alert("OK");
                                    window.location.reload(true);
                                    //$( this ).dialog( "close" );
                                }
                            }
                        });
                    } else {
                        $(".hiddenFailedCancelPopup").dialog({
                            modal: true,
                            buttons: {
                                "OK": function() {
                                    $( this ).dialog( "close" );
                                }
                            }
                        });
                    }
                });
             },
            "No": function() {
                $(this).dialog("close");
            }
        }
    });
}

$(".cancelButton").on('click',cancelJob);

$("body").on({
    ajaxStart: function(cancelJob) {
        $(this).addClass("loading");
    },
    ajaxStop: function(cancelJob) {
        $(this).removeClass("loading");
        refreshPage();
    }
});

この実装の問題は、 を表示する$(".hiddenCancelledPopup").dialogと、ユーザーがボタンをクリックする前であっても、ダイアログが予期せず閉じてしまうことOKです。消える前に少しの間表示されました。

(30 秒ごとに更新することsetTimeout(refreshPage,30000);を意味する) 問題が発生する可能性があることは認識していますが、30 秒間隔の前にダイアログがはるかに短く閉じられることがわかりました。この問題を解決する方法についてのアイデアはありますか? ありがとう。