一、前台頁面：
主要是一個按鈕和一個表格，表格有顯示數據，按鈕負責將表格中的數據選擇性地導出。除此外，可以附加一個小窗口和進度條，用於顯示下載進度。
1. 按鈕：<a href="javascript:;" class="easyui-linkbutton" iconCls="icon-redo" data-options="plain:true" id="btn-exp" onclick="fun_export()">導出詳細信息</a>
2.表格：<div id="dataGrid" style="margin-bottom:5px;margin-top:1px">
<table id="dg" data-options="toolbar:'#tb'"></table>
</div>
3.進度條和小窗口
<div id="win" class="easyui-window" title="下載中" style="width: 500px; height: 80px" data-options="iconCls:'icon-save',modal:true">
<div id="p" class="easyui-progressbar" data-options="value:10" style="width:400px;margin-top:10px;margin-left:50px;"></div>
</div>
4.下載框：<iframe id="bgfileDownFrame" src="" style="display:none; visibility:hidden;"></iframe>
二、jS請求
<script>
function fun_export(){
$('#win').window('open');
setProgress();
//AJAX請求
$.ajax({
url:'${pageContext.request.contextPath}/media/getExl.action', //TODO
data:{},
type: 'post',
dataType:"json",
success: function(data){
// alert("導出！！！！！");
if(data.isSuccess == "true"){
$("#bgfileDownFrame").attr("src","${pageContext.request.contextPath}/media/downloadExl.action?docToken="+data.token);
value = 100;
setProgress();
$('#win').window('close');
}
else{
$('#win').window('close');
alert("生成統計表出錯！");
}
},
});
}
//設置進度條的值
function setProgress(){
var value = $('#p').progressbar('getValue');
if (value < 100){
value += Math.floor(Math.random() * 20);
$('#p').progressbar('setValue', value);
setTimeout(arguments.callee, 200);
}
} </script>
三、action請求方法：
@Action(value="getExl")
public String getExl(){
Map<String,String> result = new HashMap<String,String>();
result.put("isSuccess", "false");
/* 數據來源*/
Map<String, Object> dataMap = new HashMap<String, Object>();//導出結果
List<Map<String, Object>> resultTable1 = mediaManageBPO.getMediaInfo();
dataMap.put("rows", resultTable1);
//路徑
String webPath = this.request.getSession().getServletContext().getRealPath("");
MDoc mdoc = new MDoc();
try {
String tmpFileDir = webPath + File.separator +"docTemplate";
//檢查臨時文件夾是否存在
Util.checkDirExist(tmpFileDir);
//20161227105212956742620
String fileToken = Util.generateTmpFileName(tmpFileDir);
//fileToken 是生成的臨時文件名
String docTemplatePath = webPath + File.separator +"docTemplate" + File.separator + fileToken;
//media.ftl是模板文件，先根據xls文件--另存為xml文件--eclipse下再重命名為ftl文件
String templateName = "media.ftl";
mdoc.createXls(dataMap, docTemplatePath,templateName);
result.put("isSuccess", "true");
result.put("token", fileToken);
this.request.getSession().setAttribute("DownloadFile","數據統計表"+UtilsLXJ.getDate());
} catch (UnsupportedEncodingException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
outputJson(result);
return NONE;
}
//下載
@Action(value="downloadExl")
public String downloadExl(){
//數據統計表20161227105333.xls
String downloadName = (String)this.request.getSession().getAttribute("DownloadFile");
if(Util.trim(downloadName).isEmpty()){
downloadName = "數據統計.xls";
}else{
downloadName = downloadName + ".xls";
}
try {
OutputStream os = this.response.getOutputStream();
if (Util.isIE(this.request)) {
downloadName = URLEncoder.encode(downloadName, "utf-8");
} else {
downloadName = new String(downloadName.getBytes("utf-8"),
"iso-8859-1");
}
this.response.setContentType("application/x-download");
this.response.addHeader("Content-Disposition",
"attachment;filename=\"" + downloadName + "\"");
this.response.flushBuffer();
String webPath = this.request.getSession().getServletContext().getRealPath("");
//tmpFileDir臨時文件的位置
String tmpFileDir = webPath + File.separator +"docTemplate";
//臨時文件后面加上文件token
String bgFile = tmpFileDir + File.separator + docToken;//docToken是從getExl action那里傳來的
FileInputStream fis = new FileInputStream(bgFile);
//輸出
Util.copyStrem(fis, os);
fis.close();
os.close();
//刪除臨時文件
Util.delFile(bgFile);
} catch (IOException e) {
e.printStackTrace();
}
return NONE;
}
結果就是如下：
