ExtJS 在下载文件时显示“处理下载”答案

【问题标题】：ExtJS show "processing download" when downloading a fileExtJS 在下载文件时显示“处理下载”
【发布时间】：2014-07-07 15:45:07
【问题描述】：

我有我的 ExtJS 4.2.1 应用程序，其中有一个用于生成和下载 PDF 报告的报告部分。

现在在我的控制器中，我有这个用于下载文件：

onPrint: function() {


        Ext.core.DomHelper.append(document.body, {
            tag: 'iframe',
            id: 'downloadIframe',
            frameBorder: 0,
            width: 0,
            height: 0,
            css: 'display:none;visibility:hidden;height:0px;',
            src: '/api/report/GenerateReport'
        });
}

工作正常，但有报告采用5 to 10 seconds to generate，因此用户可能会click 多次Print 按钮，因为他不知道正在生成的文件。

如何显示掩码“处理下载”或其他内容，以便在文件下载之前阻止 UI。

谢谢。

【问题讨论】：

标签： extjs extjs4 extjs4.1 extjs4.2 extjs-mvc

【解决方案1】：

包含打印按钮的父面板应该具有属性

waitMsgTarget: true,

在按钮的处理函数上，在调用 onPrint() 之前，添加以下行：

waitMsg: 'Processing download...',

希望对你有帮助。

【讨论】：

这在使用 iframe 下载文件时不起作用。实际上，Chrome 在 IFrame 事件方面存在问题。它永远不会触发 onload 事件。
可以分享一下那个文件的JS代码吗？我使用了 fpdf 库，它工作得很好，如果你想看看我做了什么，请告诉我，我会分享这些文件

【解决方案2】：

我结束的解决方案如下：

A.使用 Ajax 调用将生成文件但将临时存储在服务器上的服务器方法。这里我显示一条等待消息

文件的名称是一个 Guid。

B.在服务器上创建文件后，我会用文件名响应客户端。

C.成功响应的客户端会创建一个 IFrame，它的 src 属性指向刚刚创建的文件 URL。

D.文件已下载。

【讨论】：