解锁界面与打开/另存为对话框后的jQuery插件BlockUI

Question

我使用jQuery BlockUI Plugin当点击事件被触发以示忙消息出现。

在下面的情况下，它的正常工作。忙消息在点击事件中显示并锁定UI，并在回发完成时消失。

没有文件创建参与，这将调用浏览器打开/另存为对话框

马克 - 达：

$(function() { // when document has loaded 

    ($.unblockUI); //unlock UI 

    //Show busy message on click event and disable UI 
    $('#btnDemo').click(function() { 
    $.blockUI({ message: '<h3>Please wait...</h3>' }); 

    }); 

}); 

<asp:Button ID="btnDemo" runat="server" Text="Hello World" /><br/> 

后面的代码：

Protected Sub btnDemo_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnDemo.Click 
     Label1.Text = "Hello World" 
     Threading.Thread.Sleep(6000) 
    End Sub 

现在，这里出现问题。涉及文件创建，它调用浏览器打开/另存为对话框。忙消息在点击事件中显示并锁定UI，但在回发完成并且用户保存文件时不消失和解锁UI。

马克 - 达：

$(function() { // when document has loaded 

    ($.unblockUI); //unlock UI 

    //Show busy message on click event and disable UI 
    $('#btnCreateFile').click(function() { 
    $.blockUI({ message: '<h3>Please wait...</h3>' }); 

    }); 

}); 

<asp:Button ID="btnCreateFile" runat="server" Text="Create File" /><br/> 

代码隐藏：

Protected Sub btnCreateFile_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnCreateFile.Click 

    Dim filename As String = "demo.xls" 
    Response.ContentType = "application/vnd.ms-excel" 
    Response.AddHeader("Content-Disposition", String.Format("attachment;filename={0}", filename)) 
    Response.Clear() 

    Response.[End]() 

    End Sub 

我想摆脱繁忙的消息，并且打开/保存对话框出现时，解锁界面。

Answer 1

我在这里问同样的问题：Unblock (jQuery BlockUI) after file sent to browser through response stream（无答案）。

我不认为这是可能的。从我所看到的页面明显回发，但由于响应是一个文件流的页面不会重新加载，无需客户端事件触发页面只是停留在无人过问。

大多数教程建议你创建该文件，再直接在客户端的“下载页面”。你可以通过一个iFrame完成所有这些。所以回发，生成文件，设置一些客户端网站jquery在document.ready上运行，以创建一个带有src的说明的iFrame：/downloadFile.aspx?fileID=blah

该对话框应该仍然正常，但您现在可以控制解锁UI。

Answer 2

的Javascript：

$(document).ready(function() { 
    $('#create_pdf_form').submit(function() { 
     blockUIForDownload(); 
    }); 
    }); 

    var fileDownloadCheckTimer; 
    function blockUIForDownload() { 
    var token = new Date().getTime(); //use the current timestamp as the token value 
    $('#download_token_value_id').val(token); 
    $.blockUI(); 
    fileDownloadCheckTimer = window.setInterval(function() { 
     var cookieValue = $.cookie('fileDownloadToken'); 
     if (cookieValue == token) 
     finishDownload(); 
    }, 1000); 
    } 

服务器端：

var response = HttpContext.Current.Response; 
response.Clear(); 
response.AppendCookie(new HttpCookie("fileDownloadToken", downloadTokenValue); //downloadTokenValue will have been provided in the form submit via the hidden input field 
response.AddHeader("Content-Disposition", string.Format("attachment; filename={0}", desiredFileName)); //desiredFileName will be whatever the resutling file name should be when downloaded 

//Code to generate file and write file contents to response 

response.Flush(); 

这里是链接到的分辨率。

http://geekswithblogs.net/GruffCode/archive/2010/10/28/detecting-the-file-download-dialog-in-the-browser.aspx

BR，耶尔内伊