我正在开发一个个人网站,我的资源中有一个 pdf。
我需要一个带有处理程序的按钮来在浏览器中保存 pdf 文件。 我的应用程序只有客户端。
如何使用 Extjs 在浏览器中下载 pdf 文件?
最佳答案
以下代码用于使用 extjs 下载 pdf。添加以下代码应该为按钮操作调用。这将直接下载文件而不是在新选项卡中打开。 确保服务器端有
服务器端
在服务器端生成报告后,您应该设置以下 header
header.set("application/pdf");
header.set("Content-disposition: inline; filename=Test.pdf");
客户端 <强>1。在 View 中添加按钮
{
xtype: 'button',
text: 'Print PDF',
cls: 'printPdfBtn',
listeners: {
click: 'printReport'
//click: 'openReport'
}
}
<强>2。在 Controller 中添加监听方法。
选项:1 使用隐藏的 iframe 下载 pdf 文件。
像这样使用 iframe:
/**
* prints the file
*/
printReport: function () {
var url = 'downloadURL';
Ext.Ajax.request({
url: url,
method: 'GET',
autoAbort: false,
success: function(result) {
if(result.status == 204) {
Ext.Msg.alert('Empty Report', 'There is no data');
} else if(result.status == 200) {
Ext.DomHelper.append(Ext.getBody(), {
tag: 'iframe',
frameBorder: 0,
width: 0,
height: 0,
css: 'display:none;visibility:hidden;height:0px;',
src: url
});
}
},
failure: function() {
// failure action
}
});
}
从extjs forum复制答案
以下代码用于使用 extjs 下载文件。将以下代码添加到方法中并为按钮操作调用它。 PDF 将在新标签页中打开。
选项:2 在选项卡中打开 pdf。 如果你想在新标签页中打开文件
/**
* open file in tab
*/
openReport: function () {
var url = 'downloadURL';
Ext.Ajax.request({
url: url,
method: 'GET',
autoAbort: false,
success: function(result) {
if(result.status == 204) {
Ext.Msg.alert('Empty Report', 'There is no data');
} else if(result.status == 200) {
var win = window.open('', '_blank');
win.location = url;
win.focus();
}
},
failure: function() {
// failure action
}
});
}
关于javascript - 如何使用 ExtJS 4.2.1 下载 pdf 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21078879/