EasyUi Datagrid to Excel table2excel

最新推荐文章于 2021-04-20 15:43:51 发布

原创最新推荐文章于 2021-04-20 15:43:51 发布 · 1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#easyui #table #excel #datagrid

js 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一种使用easyui datagrid将表格数据导出为Excel文件的方法，适用于谷歌、火狐等现代浏览器，但不支持IE。通过扩展$.fn.datagrid.methods，实现了将当前datagrid中的数据转换为Excel兼容的HTML格式并触发下载。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

表格数据导出到excel

参考链接1：http://www.jeasyui.com/forum/index.php?topic=5189.0

参考链接2：http://www.jeasyui.com/forum/index.php?topic=4192.0

添加全局JS

/*
       easyui datagrid table to excel
       support firefox google
       no support IE
    */
	$.extend($.fn.datagrid.methods, {
	  toExcel: function(jq, filename){
	    return jq.each(function(){
	      var uri = 'data:application/vnd.ms-excel;base64,'
	      , template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>'
	      , base64 = function (s) { return window.btoa(unescape(encodeURIComponent(s))) }
	      , format = function (s, c) { return s.replace(/{(\w+)}/g, function (m, p) { return c[p]; }) }
	
	      var alink = $('<a style="display:none"></a>').appendTo('body');
	      var view = $(this).datagrid('getPanel').find('div.datagrid-view');
	      
	      var table = view.find('div.datagrid-view2 table.datagrid-btable').clone();
	      var tbody = table.find('>tbody');
	      view.find('div.datagrid-view1 table.datagrid-btable>tbody>tr').each(function(index){
	        $(this).clone().children().prependTo(tbody.children('tr:eq('+index+')'));
	      });
	      
	      var head = view.find('div.datagrid-view2 table.datagrid-htable').clone();
	      var hbody = head.find('>tbody');
	      view.find('div.datagrid-view1 table.datagrid-htable>tbody>tr').each(function(index){
	        $(this).clone().children().prependTo(hbody.children('tr:eq('+index+')'));
	      });    
	      hbody.prependTo(table);
	      
	      var ctx = { worksheet: name || 'Worksheet', table: table.html()||'' };
	      alink[0].href = uri + base64(format(template, ctx));
	      alink[0].download = filename;
	      alink[0].click();
	      alink.remove();
	    })
	  }
	});

调用代码：

$('#table').datagrid('toExcel','text.xls');

测试结果：

支持谷歌火狐等浏览器，IE不支持