How to export an HTML table as a .xlsx file
I have a question about exporting an HTML table as an xlsx file. I did some work and now I can export it as an xls, but I need to export it as an xlsx.
Here is my jsFiddle: https://jsfiddle.net/272406sv/1/
Here is my HTML:
<table id="toExcel" class="uitable">
<thead>
<tr>
<th>Kampanya Basligi</th>
<th>Kampanya Türü</th>
<th>Kampanya Baslangiç</th>
<th>Kampanya Bitis</th>
<th style="text-align: center">Aksiyonlar</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="Item in campaign.campaignList">
<td> Item.CampaignTitle </td>
<td> Item.CampaignHotelType </td>
<td> Item.CampaignHotelCheckInDate) </td>
<td>Item.CampaignHotelCheckOutDate</td>
<td style="text-align: center">
<button> Some Action </button>
</td>
</tr>
</tbody>
</table>
<button onclick="exceller()">EXCEL</button>
Here is my JavaScript code:
<script>
function exceller() {
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 toExcel = document.getElementById("toExcel").innerHTML;
var ctx = {
worksheet: name || '',
table: toExcel
};
var link = document.createElement("a");
link.download = "export.xls";
link.href = uri + base64(format(template, ctx))
link.click();
}
</script>
Answer
A great client-side tool for exporting html tables to xlsx, xls, csv, or txt is TableExport by clarketm (me). It is a simple, easy-to-implement, full-featured library with a bunch of configurable properties and methods.
Install
$ npm install tableexport
Usage
TableExport(document.getElementsByTagName("table"));
// OR using jQuery
$("table").tableExport();
Documentation
Sample apps to get you started
- TableExport + RequireJS
- TableExport + Flask
- TableExport + Webpack 1
- TableExport + Angular 4 + Webpack 2
Check out the compendious docs or just head over to
TableExporton Github for a full list of features.