jeecg v3.6.6 excel通过的导入方法，需要Flash支持，所以自己修改了下，先标记，日后慢慢完善
1、列表页面
1 <t:datagrid name="jzyxfkAirportsList" checkbox="true" fitColumns="true" title="机场信息表" actionUrl="jzyxfkAirportsController.do?datagrid" idField="id"
2 fit="true" queryMode="group" sortName="id" sortOrder="asc">
3 <t:dgCol title="自动编号" field="ref" hidden="true" queryMode="group" width="120"></t:dgCol>
4 <t:dgCol title="机场三字代码" field="id" query="true" queryMode="single" width="120"></t:dgCol>
5 <t:dgCol title="国际民航组织代码" field="icao" hidden="true" queryMode="group" width="120"></t:dgCol>
6 <t:dgCol title="英文名称" field="name" hidden="true" queryMode="single" width="120"></t:dgCol>
7 <t:dgCol title="中文名称" field="nameZh" query="true" queryMode="single" width="120"></t:dgCol>
8 <t:dgToolBar title="录入" icon="icon-add" url="jzyxfkAirportsController.do?goUpdate" funname="addbytab"></t:dgToolBar>
9 <t:dgToolBar title="编辑" icon="icon-edit" url="jzyxfkAirportsController.do?goUpdate" funname="updatebytab"></t:dgToolBar>
10 <t:dgToolBar title="批量删除" icon="icon-remove" url="jzyxfkAirportsController.do?doBatchDel" funname="deleteALLSelect"></t:dgToolBar>
11 <t:dgToolBar title="查看" icon="icon-search" url="jzyxfkAirportsController.do?goUpdate" funname="detailbytab"></t:dgToolBar>
12 <t:dgToolBar title="导入" icon="icon-put" funname="ImportXls"></t:dgToolBar>
13 </t:datagrid>
14 <script type="text/javascript">
15 //导入
16 function ImportXls() {
17 openuploadwina(‘Excel导入‘, ‘jzyxfkAirportsController.do?upload‘, "jzyxfkAirportsList");
18 }
19 </script>
2、创建上传页面窗口js公共方法
1 function openuploadwina(title, url,name,width, height) {
2 gridname=name;
3 $.dialog({
4 width:700,
5 height:400,
6 content: ‘url:‘+url,
7 title:title,
8 zIndex: getzIndex(),
9 cache:false,
10 lock : true, //开启遮罩层
11 opacity : 0.3,
12 button: [
13 {
14 name: "开始上传",
15 callback: function(){
16 var iframe = this.iframe.contentWindow; //获取iframe对象
17 $(‘#subBtn‘, iframe.document).click(); //点击“开始上传”按钮，触发iframe页面提交按钮18 return false;
19 },
20 focus: true
21 },
22 {
23 name: "取消上传",
24 cancel: true,
25 callback: function(){
26 document.location.reload(); //刷新父级页面
27
28 }
29 }
30 ]
31 });
32 }
3、Controller方法
1 /**
2 * 导入功能跳转
3 *
4 * @return
5 */
6 @RequestMapping(params = "upload")
7 public ModelAndView upload(HttpServletRequest req) {
8 req.setAttribute("controller_name","jzyxfkAirportsController");
9 return new ModelAndView("common/upload/pub_excel_upload");
10 }
4、上传页面
<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<!DOCTYPE html>
<html>
<head>
<title>通用Excel导入${controller_name}</title>
<t:base type="jquery,easyui,tools"></t:base>
<script type="text/javascript" src="<%=basePath %>/plug-in/Validform/js/Validform_v5.3.1_min_zh-cn.js"></script>
<script type="text/javascript" src="<%=basePath %>/plug-in/jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="<%=basePath %>/plug-in/jquery-plugs/form/jquery.form.js"></script>
<script type="text/javascript" src="../../../plug-in/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../../plug-in/easyui/locale/zh-cn.js"></script>
<link rel="stylesheet" href="plug-in/Validform/css/metrole/divfrom.css" type="text/css">
<link rel="stylesheet" href="plug-in/Validform/css/metrole/style.css" type="text/css">
<link rel="stylesheet" href="plug-in/Validform/css/metrole/tablefrom.css" type="text/css">
<style type="text/css">
#steps form button {font-size:14px;margin-left:5px;display: inline-block;}
#path{ font-size:14px;font-weight: bold;}
div.msg{display:none; }
#filediv{max-height:300px;overflow-x:hidden; font-size:13px; line-height: 30px; padding-left: 10px;}
#filediv b i{font-size:14px;}
#filediv i{color:#f97186;font-style:normal;padding: 0px 2px;}
#subBtn{ display: none;}
</style>
<script type="text/javascript">
//提交表单 */
function submitForm(){var option = {
url : ‘${controller_name}.do?importExcel‘,
type : ‘POST‘,
dataType : ‘json‘,
beforeSend: function () {
load();
},
complete: function () {
disLoad();
},
success : function(data) {
$(".msg").show();
$("#filediv").html(data.msg);
},
error: function(data) {
disLoad();
$.messager.alert("提示","请求超时请重试");
}
};
$(‘#formobj‘).ajaxForm(option);
}
//弹出加载层
function load() {
var div=$("#ldg_lockmask" , parent.document);
$(div).css("z-index","99999");
$("<div class=\"datagrid-mask-msg\"></div>").html("导入中，请稍候。。。").appendTo(div).css({
"display": "block" ,"height": "42px","line-height":"42px","text-indent":"2em","width":"159px","background": "#fff url(‘/plug-in/easyui/themes/metrole/images/loading.gif‘) no-repeat scroll 5px center","position": "absolute", "left": "40%", "top": "40%" ,"text-align":"center"
});
}
//取消加载层
function disLoad() {
$("#ldg_lockmask" , parent.document).css("z-index","2010");
$("#ldg_lockmask .datagrid-mask-msg" , parent.document).remove();
}
function doChoose(evt){
$(evt).parent("div").find("input[type=‘file‘]").click();
}
function doUpload(){
var files = document.getElementById("uploadFile").files[0];
if (files != null && files != undefined && files != "") {
$("#path").html(document.getElementById("uploadFile").value);
} else {
$.messager.alert("提示","请重新选择文件");
document.selection.empty();
}
}
</script>
</head>
<body style="overflow-y: hidden;padding: 0px; margin:0px;" scroll="no">
<div id="steps">
<form action="${controller_name}.do?importExcel" method="post" enctype="multipart/form-data" id="formobj">
<div class="form">
<button type="button" class="btn btn-primary" onclick="doChoose(this)">
<i class="fa fa-plus"></i>选择需要导入的文件
</button>
<font id="path"></font>
<input type="file" name="files" id="uploadFile" style="display: none;" onchange="doUpload()">
<input type="submit" onclick="submitForm()" value="提交" class="ace_button" id="subBtn">
</div>
<div class="msg form"><p id="filediv"></p></div>
</form>
</div>
</body>
</html>
原文地址：https://www.cnblogs.com/22MM/p/10278239.html
时间： 2024-10-10 11:01:24