1.在项目中新建一个Excel数据模板用于添加数据
如下图所示:
2.前端页面使用超链接提供模板下载地址
1 <html lang="zh_CN" xmlns:th="http://www.thymeleaf.org" 2 xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"> 3 <meta charset="utf-8"> 4 <head th:include="include::header"></head> 5 <title>导入</title> 6 <style type="text/css"> 7 .message .files { 8 position: absolute; 9 left: -1000px; 10 top: 52px; 11 heigth: 26px; 12 cursor: pointer; 13 filter: Alpha(opacity = 0); 14 -moz-opacity: 0; 15 opacity: 0; 16 } 17 </style> 18 </head> 19 <body> 20 <form id="signupForm" method="post" enctype="multipart/form-data"> 21 <input name="publishTaskId" id="publishTaskId" th:value="${publishTaskId}" hidden> 22 <div id="dpLTE" class="container-fluid tc-box"> 23 <table class="form" id="form" style="table-layout: fixed;"> 24 <tr> 25 <td colspan="2"> 26 <a id="zhCna" 27 href='/modelExcle/fieldTemplate.xlsx'> 28 <button type="button" class="btn btn-default" 29 style="margin-bottom: 10px"> 30 <i class="fa fa-download"></i> 下载导入模板 31 </button> 32 </a> 33 <div class="alert alert-warning">提示:请先下载批量导入模板-excel文件,按格式填写后上传提交,方可导入; 34 </div> 35 </td> 36 </tr> 37 <tr> 38 <td><input type="text" id="txt" name="txt" 39 class="input form-control" value="文件域" disabled="disabled" /></td> 40 <td class="message"> 41 <input type="button" 42 onMouseMove="f.style.pixelLeft=event.x-60;f.style.pixelTop=this.offsetTop;" 43 value="选择文件" size="30" onClick="f.click()" class="btn btn-orange" 44 style="margin-left: 10px"> 45 <input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" name="SensitiveExcle" id="f" onChange="txt.value=this.value" style="height: 26px;" class="files" size="1" hidefocus> 46 </td> 47 </tr> 48 </table> 49 </div> 50 <div class="form-group"> 51 <div class="col-sm-6 col-sm-offset-5"> 52 <button type="submit" class="btn btn-primary">提交</button> 53 </div> 54 </div> 55 </form> 56 <div th:include="include::footer"></div> 57 58 <script src="/js/appjs/sys/auditSecPage/import.js"></script> 59 </body> 60 </html>
3.js中调用后台方法接收EXCEL文件流
1 function save() { 2 var formData = new FormData($('#signupForm')[0]); 3 $.ajax({ 4 url : "/sys/audit/importdata", 5 type: 'POST', 6 data: formData, 7 async: true, 8 cache: false, 9 contentType: false, 10 processData: false, 11 error : function(request) { 12 parent.layer.alert("网络超时"); 13 }, 14 success : function(data) { 15 if (data.code == 0) { 16 parent.layer.msg("操作成功"); 17 parent.reLoad(); 18 var index = parent.layer.getFrameIndex(window.name); 19 parent.layer.close(index); 20 } else { 21 parent.layer.alert(data.msg) 22 } 23 24 } 25 }); 26 27 }