您的位置:首页 > 其它

[置顶] 实用插件(十一)table数据导出插件——tableExport

2018-01-16 16:46 246 查看
先引入3个js文件:点我下载

<script src="Blob.js"></script>
<script src="FileSaver.js"></script>
<script src="tableExport.js"></script>


1.html:

<table class="table table-striped table-hover" id="table2" style="display:none;">
<thead>
<tr>
<td><strong>序号</strong></td>
<td><strong>场馆名称</strong></td>
<td><strong>预约人</strong></td>
<td><strong>预约时间段</strong></td>
<td><strong>预约说明</strong></td>
<td><strong>状态</strong></td>
<td><strong>分派人</strong></td>
<td><strong>分派时间</strong></td>
<td><strong>分派说明</strong></td>
<td><strong>场馆负责人</strong></td>
<td><strong>离馆时间</strong></td>
<td><strong>离馆备注</strong></td>
<td><strong>离馆操作人</strong></td>
</tr>
</thead>
<tbody id="content">

</tbody>
</table>
<a id="daochu" class="btn btn-default">导出</a>


2.js:

$("#daochu").click(function(){
initRecordExcel(1,100000);
tableExport('table2', '场馆预约信息', 'xls');//table的id,导出文件名称,导出文件格式(json、txt、csv、xls、doc)
});

function initRecordExcel(pageNo,total){
$.ajax({
url: baseUrl+"/getNote.htm",
type: 'POST',
async:false,
dataType:'JSON',
data: {
"token":token,
"pageNo":pageNo,
"pageSize": total,
"sort":"asc"
},
success: function (res) {
if(res.code == '0'){
console.log(res);
//主体表格
var tbodyHtml = "";
$.each(res.data,function(k,v){
tbodyHtml += '<tr>';
tbodyHtml += '<td>'+((pageNo-1)*20+k+1)+'</td>';
tbodyHtml += '<td>'+v.siteName+'</td>';
tbodyHtml += '<td>'+v.bookingPerson+'</td>';
tbodyHtml += '<td>'+format(v.startDate)+' - '+format(v.defaultEndDate)+'</td>';
tbodyHtml += '<td>'+v.bookingComment+'</td>';
tbodyHtml += '<td>'+v.dispatchStatus+'</td>';

tbodyHtml += '<td>'+v.dispatchName+'</td>';
tbodyHtml += '<td>'+format(v.dispatchDate)+'</td>';
tbodyHtml += '<td>'+v.dispatchComment+'</td>';

/* tbodyHtml += '<td>'+v.principal+'</td>'; */
//负责人(如果1个,直接在td显示姓名;如果多个在td显示总数,提示框显示姓名)
tbodyHtml += '<td>';
$.each(v.principal,function(k1,v1){
$.each(v1,function(k2,v2){
if(k2 == 1){
tbodyHtml += ' '+v2+' ';
}
})
})
tbodyHtml += '</td>';

tbodyHtml += '<td>'+format(v.endDate)+'</td>';
tbodyHtml += '<td>'+v.overComment+'</td>';
tbodyHtml += '<td>'+v.operationPrincipalName+'</td>';

tbodyHtml += '</tr>';

})
$("#table2 #content").html(tbodyHtml);
}else{
console.log(res);
}
},
Error: function (xhr, type, errorThrown) {
console.log(JSON.stringify(xhr));
console.log(type);
console.log(errorThrown);
}

});
}


3.导出效果图

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: