使用Ajax Modal Popup取消执行代码 [英] Canceling the execution of code with an Ajax Modal Popup

问题描述

我在服务器上执行代码时在客户端上显示了一个Ajax Modal Popup.弹出窗口只有一个按钮可以取消弹出窗口.

Ajax Popup可以完美地工作，它会按预期出现，并在服务器代码执行完毕或单击取消"按钮时消失.

问题是，当单击取消"按钮时，尽管隐藏了模式弹出窗口，但服务器上的代码将继续运行直到完成.服务器代码可能需要几分钟才能完成，从而为用户带来许多问题.

我的问题是，是否有一种方法可以在服务器上检测到单击了弹出窗口的取消"按钮，以便可以停止执行服务器代码?提前谢谢.

这是:

I show an Ajax Modal Popup on the client while executing code on the server. The Popup has just one button to cancel the popup.

The Ajax Popup works perfectly, it appears when expected and goes away when the server code finishes executing or the cancel button is clicked.

The problem is that when the cancel button is clicked, although the modal popup is hidden, the code on the server will continue to run until completed. The server code can take several minutes to finish creating a number of problems for the user.

My question, is there a way to detect on the server that the cancel button of the popup was clicked so I can stop the exectuion of the server code? Thanks in advance.

Here is the :

function pageLoad(sender, args) {
        var sm = Sys.WebForms.PageRequestManager.getInstance();
        if (!sm.get_isInAsyncPostBack()) {
            sm.add_beginRequest(onBeginRequest);
            sm.add_endRequest(onRequestDone);
        }
    }
    function onBeginRequest(sender, args) {
        var send = args.get_postBackElement().value;
        if (displayWait(send) == "yes") {
            $find('PleaseWaitPopup').show();
        }
    }
    function onRequestDone() {
        $find('PleaseWaitPopup').hide();
    }
    function displayWait(send) {
        switch (send) {
            case "Start Matching...":
                return ("yes");
                break;
            default:
                return ("no");
                break;
        }
    }

<asp:UpdatePanel ID="PleaseWaitPanel" runat="server"    RenderMode="Inline&quot"

<ContentTemplate>
                <asp:Button ID="btnMatch" name="btnMatch" runat="server" Text="Start Matching..." />
</ContentTemplate>
</asp:UpdatePanel>
<asp:Panel ID="PanelPopup" runat="server" CssClass="modalPopup" style="display: none;">
    Please wait while we find matches to your items!
    <img src="../images/loading.gif" />
    <asp:Button ID="btnModalCancel" Text="Cancel Matching" runat="server" />
</asp:Panel>
<asp:Button ID="HiddenButton> runat="server" CssClass="hidden" Text="Hidden Button"

        ToolTip="Necessary for Modal Popup Extender" />
<ajx:ModalPopupExtender ID="PleaseWaitPopup" BehaviorID="PleaseWaitPopup" BackgroundCssClass="modalBackground" runat="server"

        TargetControlID="HiddenButton" PopupControlID="PanelPopup" CancelControlID="btnModalCancel">
</ajx:ModalPopupExtender>

例程后面的代码:

And the code behind routine:

Protected Sub btnMatch_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnMatch.Click

    'Handles a large amount of data processing
    'which can sometimes take several minutes

End Sub

推荐答案

find(' PleaseWaitPopup').show(); } } 函数 onRequestDone(){

find('PleaseWaitPopup').show(); } } function onRequestDone() {

find(' PleaseWaitPopup').hide(); } 功能 displayWait(发送){ 开关(发送){ 案例 " : 返回(" )； break ; 默认: 返回(" )； break ; } }

find('PleaseWaitPopup').hide(); } function displayWait(send) { switch (send) { case "Start Matching...": return ("yes"); break; default: return ("no"); break; } }

<asp:UpdatePanel ID="PleaseWaitPanel" runat="server"    RenderMode="Inline&quot"

<ContentTemplate>
                <asp:Button ID="btnMatch" name="btnMatch" runat="server" Text="Start Matching..." />
</ContentTemplate>
</asp:UpdatePanel>
<asp:Panel ID="PanelPopup" runat="server" CssClass="modalPopup" style="display: none;">
    Please wait while we find matches to your items!
    <img src="../images/loading.gif" />
    <asp:Button ID="btnModalCancel" Text="Cancel Matching" runat="server" />
</asp:Panel>
<asp:Button ID="HiddenButton> runat="server" CssClass="hidden" Text="Hidden Button"

        ToolTip="Necessary for Modal Popup Extender" />
<ajx:ModalPopupExtender ID="PleaseWaitPopup" BehaviorID="PleaseWaitPopup" BackgroundCssClass="modalBackground" runat="server"

        TargetControlID="HiddenButton" PopupControlID="PanelPopup" CancelControlID="btnModalCancel">
</ajx:ModalPopupExtender>

例程后面的代码:

And the code behind routine:

Protected Sub btnMatch_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnMatch.Click

    'Handles a large amount of data processing
    'which can sometimes take several minutes

End Sub

这里是一般关于如何获得想要跑步的东西的想法.它将需要少量客户端代码来用于计时器并稍微更新弹出窗口.

异步调用该方法(就像通过更新面板所做的那样).

让该方法更新会话以进行进度，并检查会话中的取消标志.如果设置了取消标志，请结束处理，清理，设置最终状态并返回.

显示弹出窗口时，在客户端上启动JavaScript计时器.通过另一个方法/异步调用让前端检查进度.

让前端发送一条消息来设置会话中的取消标志.

处理完成后，请在会话中设置最终状态，以防滴答再次执行.完成后清理计时器.

希望这会有所帮助.

Here''s a general idea about how to get what you''re looking for running. It will need a small amount of client side code for a timer and to update the popup a bit.

Call the method asynchronously (as you''re doing through the update panel).

Have the method update the session as to progress, and check the session for a cancel flag. If the cancel flag is set, end your processing, clean up, set a final status and return.

Start a javascript timer on the client when you show the popup. Have the front end check for progress via another method/async call.

Have the front end send a message to set the cancel flag in the session.

When the processing is complete, set a final status in the session in case the tick executes again. Clean up your timer when it''s done.

Hope this helps.

这篇关于使用Ajax Modal Popup取消执行代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！