Skip to content

Commit fe140b5

Browse files
committed
Add CSV data format.
1 parent cc2dd60 commit fe140b5

File tree

3 files changed

+64
-12
lines changed

3 files changed

+64
-12
lines changed

README.md

+22-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,29 @@
11
ExcellentExport.js
22
==================
33

4-
Javascript export to Excel
4+
Javascript export to Excel or CSV
55

6-
A quick Javascript librery to create export to Excel from HTML tables automatically in the browser. No server required.
6+
A quick Javascript librery to create export to Excel/CSV from HTML tables automatically in the browser. No server required.
77

88
Check my blog page for testing:
99
[Javascript export to Excel](http://jordiburgos.com/post/2013/javascript-export-to-excel.html)
10+
11+
Usage
12+
=====
13+
14+
<table id="datatable">
15+
<tr>
16+
<td>100</td> <td>200</td> <td>300</td>
17+
</tr>
18+
<tr>
19+
<td>400</td> <td>500</td> <td>600</td>
20+
</tr>
21+
</table>
22+
23+
<a download="somedata.xls" href="#" onclick="return ExcellentExport.excel(this, 'datatable', 'Sheet Name Here');">Export to Excel</a>
24+
<a download="somedata.csv" href="#" onclick="return ExcellentExport.csv(this, 'datatable');">Export to CSV</a>
25+
26+
Revision history:
27+
28+
1.0 Added Excel data export
29+
1.1 Added CSV data export

excellentexport.js

+26-7
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,18 @@
11
/*
2-
* ExcellentExport
2+
* ExcellentExport.
3+
* A client side Javascript export to Excel.
4+
*
5+
* @autor: Jordi Burgos ([email protected])
36
*
47
* Based on:
58
* https://gist.github.com/insin/1031969
69
* http://jsfiddle.net/insin/cmewv/
710
*
811
*/
912
window.ExcellentExport = (function() {
10-
var uri = 'data:application/vnd.ms-excel;base64,';
11-
var 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>';
13+
var version = "1.1";
14+
var uri = { excel: 'data:application/vnd.ms-excel;base64,', csv: 'data:application/csv;base64,' };
15+
var template = { excel: '<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>' };
1216
var base64 = function(s) {
1317
return window.btoa(unescape(encodeURIComponent(s)));
1418
};
@@ -18,16 +22,31 @@ window.ExcellentExport = (function() {
1822
});
1923
};
2024

25+
var get = function(element) {
26+
if (!element.nodeType) {
27+
return document.getElementById(element);
28+
}
29+
return element;
30+
};
31+
32+
var tableToCSV = function(table) {
33+
return "COL1,COL2,COL3\n100,200,300\n400,500,600";
34+
};
35+
2136
var ee = {
2237
excel: function(anchor, table, name) {
23-
if (!table.nodeType) {
24-
table = document.getElementById(table);
25-
}
38+
table = get(table);
2639
var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML};
27-
var hrefvalue = uri + base64(format(template, ctx));
40+
var hrefvalue = uri.excel + base64(format(template.excel, ctx));
2841
anchor.href = hrefvalue;
2942
// Return true to allow the link to work
3043
return true;
44+
},
45+
csv : function(anchor, table) {
46+
table = get(table);
47+
var csvData = tableToCSV(table);
48+
var hrefvalue = uri.csv + base64(csvData);
49+
anchor.href = hrefvalue;
3150
}
3251
};
3352

index.html

+16-3
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,27 @@
22
<head>
33
<title>Export to excel test</title>
44
<script src="excellentexport.js"></script>
5+
<style>
6+
table, tr, td {
7+
border: 1px black solid;
8+
}
9+
</style>
510
</head>
611
<body>
12+
<h1>ExcellentExport.js</h1>
13+
14+
Check on <a href="http://jordiburgos.com">jordiburgos.com</a> and <a href="https://github.com/jmaister/excellentexport">GitHub</a>.
15+
16+
<h3>Test page</h3>
717

8-
<input type="button" onclick="tableToExcel('datatable', 'W3C Example Table')" value="Export to Excel">
918
<br/>
1019

11-
<a download="somedata.xls" href="#" onclick="return ExcellentExport.excel(this, 'datatable', 'Sheet Name Here');">export excel good</a>
12-
20+
<a download="somedata.xls" href="#" onclick="return ExcellentExport.excel(this, 'datatable', 'Sheet Name Here');">Export to Excel</a>
21+
<br/>
22+
23+
<a download="somedata.csv" href="#" onclick="return ExcellentExport.csv(this, 'datatable');">Export to CSV</a>
24+
<br/>
25+
1326
<table id="datatable">
1427
<tr>
1528
<td>100</td>

0 commit comments

Comments
 (0)