web页面如何导出特殊格式的表格
程序员文章站
2024-01-24 12:04:58
...
1、实现思路
先将要导出的表格格式和数据生成页面,使用流的机制将页面内容全部获取发送到后台,后台再以流的形式写入execl中。
2、具体事例和步骤
如下图所示的表格格式
第一 先将该表格格式数据写入页面中,如下图
第二 在该页面中 增加js方法,将页面的内容抽取并发送至后台
我使用的页面是ftl格式的,主要方法是exportData(),exportDataSet()。
和这一段代码
第三 后台页面的dataExport方法,在struts2中使用的
第四步 数据输出的页面 dataExport.ftl
主要是设置导出的文件格式,注意头文件的信息。
3、导出的execl数据格式截图如下:
这种导出方式可以导出格式不正规的表格,很方便。
先将要导出的表格格式和数据生成页面,使用流的机制将页面内容全部获取发送到后台,后台再以流的形式写入execl中。
2、具体事例和步骤
如下图所示的表格格式
第一 先将该表格格式数据写入页面中,如下图
第二 在该页面中 增加js方法,将页面的内容抽取并发送至后台
[#ftl] [@b.head/] <body onload="exportData()"> <table align="center" class="formTable" id="exportTable" style="display: none"> <tr> <td>学校创新学分取得累计分值</td> [#list yearList as year] <td colspan="4"> ${year}级 </td> [/#list] </tr> <tr> <td></td> [#list yearList as year] <td> 竞赛类 </td> <td> 创新项目类 </td> <td> 学术论文类 </td> <td> 发明专利类 </td> [/#list] </tr> <tr> <td>20分以上</td> [#list yearList as year] <td> ${(forthMap.get(year).competCount)!} </td> <td> ${(forthMap.get(year).innovateCount)!} </td> <td> ${(forthMap.get(year).thesisCount)!} </td> <td> ${(forthMap.get(year).patentCount)!} </td> [/#list] </tr> <tr> <td>11-20分(包括20分)</td> [#list yearList as year] <td> ${(thirdMap.get(year).competCount)!} </td> <td> ${(thirdMap.get(year).innovateCount)!} </td> <td> ${(thirdMap.get(year).thesisCount)!} </td> <td> ${(thirdMap.get(year).patentCount)!} </td> [/#list] </tr> <tr> <td>7-10分(包括10分)</td> [#list yearList as year] <td> ${(secondMap.get(year).competCount)!} </td> <td> ${(secondMap.get(year).innovateCount)!} </td> <td> ${(secondMap.get(year).thesisCount)!} </td> <td> ${(secondMap.get(year).patentCount)!} </td> [/#list] </tr> <tr> <td>1-6分(包括6分)</td> [#list yearList as year] <td> ${firstMap.get(year).competCount} </td> <td> ${firstMap.get(year).innovateCount} </td> <td> ${firstMap.get(year).thesisCount} </td> <td> ${firstMap.get(year).patentCount} </td> [/#list] </tr> [@b.form name="dataExportForm" action="!dataExport" target="blank"] <input type="hidden" name="courseTableHTML" value=""/> [/@] </table> </body> <script> [#--编制导出内容--] function exportData() { var outputDiv = $("<div>"); var excelTable = exportDataSet(); excelTable.appendTo(outputDiv); $("input[name*='courseTableHTML']").val(outputDiv.html()); bg.form.submit("dataExportForm"); } [#--编制导出表格样式和内容--] function exportDataSet() { var manauHTML=jQuery("#exportTable").html(); var excelTable = $("<table>"); excelTable.css("text-align", "center"); excelTable.attr("align", "center"); excelTable.attr("border", "1px"); excelTable.html(manauHTML); excelTable.find("br").each(function(){ $(this).replaceWith(" ");//利用自动换行 }); excelTable.find("*").removeAttr("title"); excelTable.find("*").removeAttr("width"); excelTable.find("*").removeAttr("height"); excelTable.find("*").removeAttr("class"); excelTable.find("td").css("text-align", "center"); return excelTable; } </script> [@b.foot/]
我使用的页面是ftl格式的,主要方法是exportData(),exportDataSet()。
和这一段代码
[@b.form name="dataExportForm" action="!dataExport" target="blank"] <input type="hidden" name="courseTableHTML" value=""/> [/@]
第三 后台页面的dataExport方法,在struts2中使用的
/** * 导出数据 * @return */ public String dataExport() { HttpServletResponse response = ServletActionContext.getResponse(); response.setHeader("Content-Disposition", "attachment;filename=dataExport.xls"); return forward(); }
第四步 数据输出的页面 dataExport.ftl
<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"> <head> <meta http-equiv=Content-Type content="application/vnd.ms-excel;charset=UTF-8"> <meta name=ProgId content=Excel.Sheet> </head> <body link=blue vlink=purple> ${Parameters["courseTableHTML"]} </body> </html>
主要是设置导出的文件格式,注意头文件的信息。
3、导出的execl数据格式截图如下:
这种导出方式可以导出格式不正规的表格,很方便。
上一篇: Java中数组的排序方法的实现方式
下一篇: Java模拟登录新浪微博
推荐阅读