2

サーバー上で長いリクエストを呼び出す Web ページがあります。要求は Excel ファイルを生成し、準備ができたらクライアントにストリーミングします。

リクエストは、jQuery を使用してフォーム要素を作成し、submit メソッドを呼び出すことによって呼び出されます。

リクエストが処理されている間、タスクの進行状況をユーザーに表示したいと思います。

ステータスメッセージを返すサーバー上にあるサービスへのjQuery ajax呼び出しを使用してそれを行うことを考えました。

私の問題は、($.ajax を使用して) このサービスを呼び出すときに、フォーム送信によって開始された要求が終了したときにのみコールバックが呼び出されることです。

助言がありますか ?

コード:

 <script>
     function dummyFunction(){       
                var notificationContextId = "someid";

                var url = $fdbUI.config.baseUrl() + "/Promis/GenerateExcel.aspx";

                var $form = $('<form action="' + url + '" method="POST" target="_blank"></form>');
                var $hidden = $("<input type='hidden' name='viewModel'/>");
                $hidden.val(self.toJSON());
                $hidden.appendTo($form);

                var $contextId = new $("<input type='hidden' name='notifyContextId'/>").val(notificationContextId);
                $contextId.appendTo($form);

                $('body').append($form);

                self.progressMessages([]);

                $fdbUI.notificationHelper.getNotifications(notificationContextId, function (message) {
                    var messageText = '';
                    if (message.IsEnded) {
                        messageText = "Excel is ready to download";
                    } else if (message.IsError) {
                        messageText = "An error occured while preparing excel file. Please try again...";
                    } else {
                        messageText = message.NotifyData;
                    }

                    self.progressMessages.push(messageText);
                });
                $form.submit();
       }
<script>

コードは、$.ajax を呼び出すユーティリティ ライブラリを使用しています。そのコードは次のとおりです。

(function () { if (!window.flowdbUI) { throw ("flowdb.ui.core への参照がありません。"); }

function NotificationHelper() {
    var self = this;

    this.intervalId = null;

    this.getNotifications = function (contextId, fnCallback) {
        if ($.isFunction(fnCallback) == false)
            return;

        self.intervalId = setInterval(function() {
            self._startNotificationPolling(contextId, fnCallback);
        }, 500);

    };

    this._startNotificationPolling = function (contextId, fnCallback) {
        if (self._processing)
            return;

        self._processing = true;
        self._notificationPolling(contextId, function (result) {                
            if (result.success) {                    
                var message = result.retVal;
                if (message == null)
                    return;
                if (message.IsEnded || message.IsError) {
                    clearInterval(self.intervalId);
                }

                fnCallback(message);
            } else {
                clearInterval(self.intervalId);
                fnCallback({NotifyData:null, IsEnded:false, IsError:true});
            }
            self._processing = false;
        });
    };

    this._notificationPolling = function (contextId, fnCallback) {
        $fdbUI.core.executeAjax("NotificationProvider", { id: contextId }, function(result) {
            fnCallback(result);
        });
    };
    return this;
}

window.flowdbUI.notificationHelper = new NotificationHelper();
})();
4

1 に答える 1