该导出插件不仅限于jqgrid生成的table,也不仅限于导出excel格式的文件,更多的使用方法请查阅相关文档
1.借助第三方库 tableExport
- 仓库地址 https://github.com/hhurz/tableExport.jquery.plugin
- 一般的excel导出需要引用以下三个文件
<script type="text/javascript" src="libs/FileSaver/FileSaver.min.js"></script>
<script type="text/javascript" src="libs/js-xlsx/xlsx.core.min.js"></script>
<script type="text/javascript" src="tableExport.min.js"></script>
2.导出按钮绑定事件如下
$('#btn_export').click(function() {
var tableid = "table_list";
var thead = $("#gbox_"+tableid +' .ui-jqgrid-htable thead');
var ee = $('#'+tableid );
//合并表头和表数据
ee.find('tbody').before(thead);
//底部有合计功能的话,还需要合并底部的tr
var footer = $('.ui-jqgrid-ftable tbody tr.footrow')
ee.find('tbody').append(footer)
//通过完整的table导出excel
ee.tableExport({
type:'excel',
escape:'false',
fileName: '农业用水管护中心 ',
ignoreColumn: ['0']
});
//将原来的table还原
var a = $("#"+tableid ).find('thead');
var _footer = $("#"+tableid ).find('tr.footrow')
//表头还原
$("#gbox_"+tableid +' .ui-jqgrid-htable').append(a);
//底部合并还原
$("#gbox_"+tableid +' .ui-jqgrid-ftable').append(_footer)
});
- 如果是其他的组件生成的table,参考思路使用即可