Skip to content

Commit 6e3a7f3

Browse files
committed
universal filesaver.js implementation for all file types
1 parent b382f94 commit 6e3a7f3

9 files changed

Lines changed: 466 additions & 135 deletions

File tree

README.md

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,12 @@ The simple, easy-to-implement plugin to export HTML tables to xlsx, xls, csv, an
66

77
### Download and Setup
88

9-
To use this plugin, include the [jQuery](https://jquery.com) library and the [TableExport.js](http://www.clarketravis.com/tableexport) plugin before the closing `<body>` tag of your HTML document:
9+
To use this plugin, include the [jQuery](https://jquery.com) library, [FileSaver.js](https://github.com/eligrey/FileSaver.js/) script, and the [TableExport.js](http://www.clarketravis.com/tableexport) plugin before the closing `<body>` tag of your HTML document:
1010

1111
```html
1212
<script src="jquery.js"></script>
13+
<script src="filesaver.js"></script>
14+
...
1315
<script src="tableexport.js"></script>
1416
```
1517

@@ -28,17 +30,17 @@ $ npm install tableexport
2830

2931
##### Required:
3032

31-
[jQuery](https://jquery.com) (1.2.1 or higher)
33+
* [jQuery](https://jquery.com) (1.2.1 or higher)
34+
* [FileSaver.js](https://github.com/eligrey/FileSaver.js/)
3235

3336
##### Optional / Theming:
3437

35-
[Bootstrap](http://getbootstrap.com/getting-started/#download) (3.1.0 or higher)
38+
* [Bootstrap](http://getbootstrap.com/getting-started/#download) (3.1.0 or higher)
3639

3740
##### Add-Ons:
38-
In order to provide **Office Open XML SpreadsheetML Format ( .xlsx )** support, you must include the following third-party scripts to your project before TableExport.js.
41+
In order to provide **Office Open XML SpreadsheetML Format ( .xlsx )** support, you must include the following third-party script to your project before TableExport.js.
3942

4043
* SheetJS -> [xlsx-core.js](https://github.com/SheetJS/js-xlsx)
41-
* Eli Grey -> [filesaver.js](https://github.com/eligrey/FileSaver.js/)
4244

4345
```html
4446
<script src="xlsx-core.js"></script>
@@ -47,7 +49,7 @@ In order to provide **Office Open XML SpreadsheetML Format ( .xlsx )** support,
4749
<script src="tableexport.js"></script>
4850
```
4951

50-
To support **.xlsx** in older browsers ( **Firefox** < 20, **Opera** < 15, **Safari** < 6 ) also include [blob.js](https://github.com/eligrey/Blob.js/) before the filesaver.js script.
52+
To support older browsers ( **Firefox** < 20, **Opera** < 15, **Safari** < 6 ) also include [blob.js](https://github.com/eligrey/Blob.js/) before the filesaver.js script.
5153

5254
```html
5355
<script src="xlsx-core.js"></script>

bower.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "tableexport.js",
3-
"version": "3.1.3",
3+
"version": "3.2.0",
44
"authors": [
55
"clarketm <travis.m.clarke@gmail.com>"
66
],

dist/js/tableexport.js

Lines changed: 88 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* TableExport.js v3.1.3 (http://www.clarketravis.com)
2+
* TableExport.js v3.2.0 (http://www.clarketravis.com)
33
* Copyright 2015 Travis Clarke
44
* Licensed under the MIT license
55
*/
@@ -31,63 +31,79 @@
3131
exporters = {
3232
xlsx: function (rDel, name) {
3333
var dataURL = $rows.map(function (i, val) {
34-
var $cols = $(val).find('th, td');
35-
return [$cols.map(function (i, val) {
36-
return $(val).text();
37-
}).get()];
38-
}).get(),
34+
var $cols = $(val).find('th, td');
35+
return [$cols.map(function (i, val) {
36+
return $(val).text();
37+
}).get()];
38+
}).get(),
3939
dataObject = escapeHtml(
40-
JSON.stringify({
41-
data: dataURL,
42-
name: name
43-
})),
44-
myFile = name + ".xlsx",
40+
JSON.stringify({
41+
data: dataURL,
42+
fileName: name,
43+
mimeType: $.fn.tableExport.xlsx.mimeType,
44+
fileExtension: $.fn.tableExport.xlsx.fileExtension
45+
})),
4546
myContent = $.fn.tableExport.xlsx.buttonContent,
4647
myClass = $.fn.tableExport.xlsx.defaultClass;
47-
createObjButton(dataObject, myFile, myContent, myClass);
48+
createObjButton(dataObject, name, myContent, myClass);
4849
},
4950
xls: function (rdel, name) {
5051
var colD = $.fn.tableExport.xls.separator,
51-
dataURL = 'data:application/vnd.ms-excel;charset=utf-8,' +
52-
encodeURIComponent($rows.map(function (i, val) {
53-
var $cols = $(val).find('th, td');
54-
return $cols.map(function (i, val) {
55-
return $(val).text();
56-
}).get().join(colD);
57-
}).get().join(rdel)),
58-
myFile = name + ".xls",
52+
dataURL = $rows.map(function (i, val) {
53+
var $cols = $(val).find('th, td');
54+
return $cols.map(function (i, val) {
55+
return $(val).text();
56+
}).get().join(colD);
57+
}).get().join(rdel),
58+
dataObject = escapeHtml(
59+
JSON.stringify({
60+
data: dataURL,
61+
fileName: name,
62+
mimeType: $.fn.tableExport.xls.mimeType,
63+
fileExtension: $.fn.tableExport.xls.fileExtension
64+
})),
5965
myContent = $.fn.tableExport.xls.buttonContent,
6066
myClass = $.fn.tableExport.xls.defaultClass;
61-
createButton(dataURL, myFile, myContent, myClass);
67+
createObjButton(dataObject, name, myContent, myClass);
6268
},
6369
csv: function (rdel, name) {
6470
rdel = '"' + rdel + '"';
6571
var colD = '"' + $.fn.tableExport.csv.separator + '"',
66-
dataURL = 'data:text/csv;charset=utf-8,' +
67-
encodeURIComponent('"' + $rows.map(function (i, val) {
68-
var $cols = $(val).find('th, td');
69-
return $cols.map(function (i, val) {
70-
return $(val).text().replace(/"/g, '""');
71-
}).get().join(colD);
72-
}).get().join(rdel) + '"'),
73-
myFile = name + ".csv",
72+
dataURL = '"' + $rows.map(function (i, val) {
73+
var $cols = $(val).find('th, td');
74+
return $cols.map(function (i, val) {
75+
return $(val).text().replace(/"/g, '""');
76+
}).get().join(colD);
77+
}).get().join(rdel) + '"',
78+
dataObject = escapeHtml(
79+
JSON.stringify({
80+
data: dataURL,
81+
fileName: name,
82+
mimeType: $.fn.tableExport.csv.mimeType,
83+
fileExtension: $.fn.tableExport.csv.fileExtension
84+
})),
7485
myContent = $.fn.tableExport.csv.buttonContent,
7586
myClass = $.fn.tableExport.csv.defaultClass;
76-
createButton(dataURL, myFile, myContent, myClass);
87+
createObjButton(dataObject, name, myContent, myClass);
7788
},
7889
txt: function (rdel, name) {
7990
var colD = $.fn.tableExport.txt.separator,
80-
dataURL = 'data:text/plain;charset=utf-8,' +
81-
encodeURIComponent($rows.map(function (i, val) {
82-
var $cols = $(val).find('th, td');
83-
return $cols.map(function (i, val) {
84-
return $(val).text();
85-
}).get().join(colD);
86-
}).get().join(rdel)),
87-
myFile = name + ".txt",
91+
dataURL = $rows.map(function (i, val) {
92+
var $cols = $(val).find('th, td');
93+
return $cols.map(function (i, val) {
94+
return $(val).text();
95+
}).get().join(colD);
96+
}).get().join(rdel),
97+
dataObject = escapeHtml(
98+
JSON.stringify({
99+
data: dataURL,
100+
fileName: name,
101+
mimeType: $.fn.tableExport.txt.mimeType,
102+
fileExtension: $.fn.tableExport.txt.fileExtension
103+
})),
88104
myContent = $.fn.tableExport.txt.buttonContent,
89105
myClass = $.fn.tableExport.txt.defaultClass;
90-
createButton(dataURL, myFile, myContent, myClass);
106+
createObjButton(dataObject, name, myContent, myClass);
91107
}
92108
};
93109

@@ -102,15 +118,10 @@
102118
$caption.length ? $caption.append(exportButton) : $el.prepend('<caption class="' + bootstrapSpacing + settings.position + '">' + exportButton + '</caption>');
103119
}
104120

105-
function createButton(dataURL, myFile, myContent, myClass) {
106-
var exportButton = '<a href="' + dataURL + '" download="' + myFile + '" role="button" class="' + bootstrapClass + bootstrapTheme + myClass + '">' + myContent + '</a>';
107-
checkCaption(exportButton);
108-
}
109-
110121
function createObjButton(dataObject, myFile, myContent, myClass) {
111122
var exportButton = "<a href='#' data-obj='" + dataObject + "' download='" + myFile + "' role='button' class='" + bootstrapClass + bootstrapTheme + myClass + "'>" + myContent + "</a>";
112123
checkCaption(exportButton);
113-
addListener(myClass)
124+
addListener(myClass);
114125
}
115126

116127
function addListener(el) {
@@ -120,8 +131,10 @@
120131
e.preventDefault();
121132
var object = $(this).data("obj"),
122133
data = object.data,
123-
fileName = object.name;
124-
export2xlsx(data, fileName);
134+
fileName = object.fileName,
135+
mimeType = object.mimeType,
136+
fileExtension = object.fileExtension;
137+
export2file(data, mimeType, fileName, fileExtension);
125138
}
126139
});
127140
}
@@ -138,27 +151,37 @@
138151
position: "bottom" // (top, bottom), position of the caption element relative to table, (default: "bottom")
139152
};
140153

154+
$.fn.tableExport.charset = "charset=utf-8";
155+
141156
$.fn.tableExport.xlsx = {
142157
defaultClass: "xlsx",
143-
buttonContent: "Export to xlsx"
158+
buttonContent: "Export to xlsx",
159+
mimeType: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
160+
fileExtension: ".xlsx"
144161
};
145162

146163
$.fn.tableExport.xls = {
147164
defaultClass: "xls",
148165
buttonContent: "Export to xls",
149-
separator: "\t"
166+
separator: "\t",
167+
mimeType: "application/vnd.ms-excel",
168+
fileExtension: ".xls"
150169
};
151170

152171
$.fn.tableExport.csv = {
153172
defaultClass: "csv",
154173
buttonContent: "Export to csv",
155-
separator: ","
174+
separator: ",",
175+
mimeType: "text/csv",
176+
fileExtension: ".csv"
156177
};
157178

158179
$.fn.tableExport.txt = {
159180
defaultClass: "txt",
160181
buttonContent: "Export to txt",
161-
separator: " "
182+
separator: " ",
183+
mimeType: "text/plain",
184+
fileExtension: ".txt"
162185
};
163186

164187
$.fn.tableExport.defaultFileName = "myDownload";
@@ -225,18 +248,22 @@
225248
return buf;
226249
}
227250

228-
function export2xlsx(data, name) {
229-
var wb = new Workbook(),
230-
ws = createSheet(data);
251+
function export2file(data, mime, name, extension) {
252+
if (extension === ".xlsx") {
253+
var wb = new Workbook(),
254+
ws = createSheet(data);
231255

232-
wb.SheetNames.push(name);
233-
wb.Sheets[name] = ws;
256+
wb.SheetNames.push(name);
257+
wb.Sheets[name] = ws;
234258

235-
var wopts = {bookType: 'xlsx', bookSST: false, type: 'binary'};
236-
var wbout = XLSX.write(wb, wopts);
259+
var wopts = {bookType: 'xlsx', bookSST: false, type: 'binary'},
260+
wbout = XLSX.write(wb, wopts);
237261

238-
saveAs(new Blob([string2ArrayBuffer(wbout)],
239-
{type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"}),
240-
name + ".xlsx");
262+
data = string2ArrayBuffer(wbout);
263+
}
264+
saveAs(new Blob([data],
265+
{type: mime + ";" + $.fn.tableExport.charset}),
266+
name + extension);
241267
}
268+
242269
}(window));

0 commit comments

Comments
 (0)