layui数据表格导出数据
0、使用需知
如果你导出的Excel文件需要修改,导出后请测试一下是否能够成功修改文件。
如果修改时提示存在兼容性问题,你选择了 是,并且保存了文件,但是再次打开发现还是修改前的内容。请参考这篇:Layui第三方扩展LAY_EXCEL导出数据表格的数据
1、使用 table.exportFile(id, data, type)
2、尽管 table 的工具栏内置了数据导出按钮,但有时你可能需要通过方法去导出任意数据,那么可以借助以下方法:
语法:table.exportFile(id, data, type)
var ins1 = table.render({
elem: '#demo'
,id: 'test'
//,…… //其它参数
})
//将上述表格示例导出为 csv 文件
table.exportFile(ins1.config.id, data); //data 为该实例中的任意数量的数据
3、相关代码:
<!-- HTML -->
<!-- 导出按钮 -->
<button class="layui-btn" id="export-id">
<i class="layui-icon layuiadmin-button-btn">导出</i>
</button>
<!-- 表格载体 -->
<table id="table-id"></table>
//JS
layui.use(['element', 'table', 'form', 'jquery', 'laydate','layer'], function () {
let table = layui.table; //表格
let form = layui.form; //表单
let layer = layui.layer; //弹层
let $ = layui.jquery;
let exportData = {}; //定义导出报表的数据
let tableObj = table.render({
elem: '#table-id' //表ID
,url: '/.../.../...' //数据来源路径
,cols: [[
/*{field: 'id', width: 80, title: 'ID', sort: true},*/
{field: 'name', align:'center',title: '姓名'}
,{field: 'hobby', title: '爱好'}
,{field: 'create_time', title: '创建时间'}
]]
,text: {
none: '暂无数据!'
}
,where:{'target_date':'2020-02'}//查询条件
,page: false //关闭分页
,parseData: function(res) {
exportData = res.data.data;
return {
code: res.code,
msg: res.msg,
count: res.data.count,
data: res.data.data
}
}
});
//表格导出
$("#export-id").click(function(){
table.exportFile(tableObj.config.id, exportData, 'xls');
})
});
4、如果title设置为ID或者ID_XXXX(XXXX为字符串),可能会报错,如图:
解释:
SYLK 文件时一个文本文件,开头的为“ID”或“ID_XXXX”(其中XXXX是文本字符串)。
SYLK 文件的第一个的记录是在 ID_Number 记录的。
Excel 将识别该文本在文本文件开头时, 它会将该文件解释为 SYLK 文件。
Excel 将尝试从该 SYLK 格式转换该文件,但不能这样做,因为"ID"字符后不有任何有效的 SYLK 代码。
因为 Excel 不能转换该文件,您收到错误消息。
当您打开一个文本文件、 CSV 文件和文件的前两个字符是大写字母"I","D"时,会发生此问题。
例如文本文件可能包含以下文本:
ID, STATUS 123, open 456, closed
如果前两个字母小写"i"和"d"不会发生此问题的 。
解决:
大概意思是你设置的title里有名为ID或者ID_XXXX,改为id或者直接去除即可。