Detect when excel dialog box appears and issue javascript command

Question

I have a "loading message" that I have appearing and disappearing in the asp.net application. A new requirement is that when a link button is clicked the loading message appears, then assumption is for it to disappear when the excel dialog pops up to either open or save or cancel (the excel file) .

How do I detect this dialog? Postback occurs, I am using Response.End, but it seems that I can't get the "loading overlay layer to disappear after interacting with the excel dialog box.

This is occurring with ASP.NET 3.5 / EXT JS (EXT.NET) , but I could use jQuery as that is in this project. I played with Fiddler, but I am a bit rusty on working with raising events and detection in the DOM. Any help is appreciated.

Answer 1

I might have had the same problem a while back. Here is the stack post...

Download a file and update panel progress

If you do the long running work in the code behind of this page your update panel will act as expected.. The life cycle of the event might go like this..

1. btnEvent to get / build the excel file.
2. In the code behind btn event do the work of building / getting the excel file and store it in cache... Then set the source of the iframe to the page that offers the excel as a download (from cache). The update panel is showing the progress html this whole time.
3. When the html refreshes the loading panel will go away and the download file prompt should appear from the iframe.

I didn't have to write any javascript to make this work using the update panel.

<asp:UpdateProgress ID="progress1" runat="server" AssociatedUpdatePanelID="up">
    <ProgressTemplate>
        <div id="processMessage">
            <table width="100%">
                <tr>
                    <td>
                        Loading...
                    </td>
                    <td>
                        <img alt="Please wait..." src="../Images/spinner.gif" />
                    </td>
                </tr>
            </table>
        </div>
    </ProgressTemplate>
</asp:UpdateProgress>


<asp:UpdatePanel runat="server" ID="up">
    <ContentTemplate>
            <div id="excel" align="right">
                <asp:Button runat="server" ID="btnExcelExport" Text="Export to Excel" OnClick="btnExcelExport_Click" />
            </div>
            <iframe runat="server" id="ifmExcel" width="0" height="0" marginheight="0" marginwidth="0" frameborder="0" />
    </ContentTemplate>
</asp:UpdatePanel>

You absolutely could do this with javascript and an ajax call using the beforeSend and complete events to show a spinner while the work was being done then change the src attr of the iframe when complete, launching the download.

Hope this helps.