Excel导入:
页面创建导入按钮,如:
代码:
<button class="layui-btn layui-btn-small layui-btn-primary ajax-all fun_UPLOAD_" id="upload" οnclick="upload()">
<i class="iconfont icon-daoru"></i>导入交易
</button>
JS:
function upload(){
layer.open({
type : 2, //层类型
title :'导入文件', //标题
shadeClose : true, //是否点击遮罩关闭
shade : [ 0.4, '#000' ], //遮罩
maxmin : false, //开启最大化最小化按钮
area : [ '460px', '350px' ], //设置宽高
offset : '5px', //坐标,默认:垂直水平居中
moveout : true, //是否允许拖拽到窗口外
content : "" //iframe的url //内容这里是路径
})
}
可以将上传文件放入form表单中,上传文件框用input框的file类型,如:
<input type="file" name="excelFile" id="file" lay-type="file" class="layui-upload-file" οnchange="upfile.value=this.value">
点击确定时submit提交表单,js如下所示:
function submit(){
//提交前校验
if(!checkDate()){
return;
}
//定义并开启上传时读取效果
var msgIndex = layer.load(1, {
shade: [0.4,'#def'], //0.4透明度的白色背景
icon : ''
});
//上传
$("#addMore").ajaxSubmit({
type : "post",
url : Const.apiUrl + "", //上传路径
dataType : "json",
success : function(resp){
layer.close(msgIndex);//关闭效果
if(resp.code == 200){
layer.open({
area: ['40%', '60%'],
title: '导入文件',
content: '成功导入信息'+resp.data+'条',
btn : ['确定'],
yes : function(index, layero) {
layer.closeAll();
}
});
}else{
layer.msg("导入失败!");
}
},
error : function(code) {
layer.close(msgIndex);
layer.msg("服务器错误,导入失败!");
}
});
}
function checkDate(){
//获取上传的文件路径
var fileName = $("#file").val();
//获取上传的文件名
var fName = fileName.substring(fileName.lastIndexOf("\\")+1,fileName.lastIndexOf("."));
//获取上传的文件后缀
var fType = fileName.substr(fileName.lastIndexOf("."));
//判断有没有文件
if(fName == ""){
layer.msg("请选择需要导入的.xls或者.xlsx文件!");
return false;
}
//判断文件格式是否正确
if(!fType || fType.toLowerCase()!=".xls" && fType.toLowerCase()!=".xlsx"){
layer.msg("请选择.xls或者.xlsx格式的文件导入!");
return false;
}
return true;
}
以上为前端页面代码,后端代码可参考:
https://www.cnblogs.com/Big-Boss/p/10007807.html
https://blog.csdn.net/u011278387/article/details/50839034
https://blog.csdn.net/u012012240/article/details/53929141
https://www.cnblogs.com/GoForMyDream/p/5912737.html