CODEWITHSUNDEEP
javascriptjqueryhtml
RavatSinh Sisodiya
RavatSinh Sisodiya

Reputation: 1608

Convert JavaScript variable value to csv file

I have a comma separated variable in my .js file, for example:

var out='';
out+="1,val1,val2,val3,val4\n";
out+="2,val1,val2,val3,val4\n";
out+="3,val1,val2,val3,val4\n";

I am displaying this value in a browser using document.write(out);.
I would like the out variable to be downloadable as a .csv file.

From data stored in a variable, is there any way to create a csv file and its associated download link in JavaScript?

jsFiddle

Upvotes: 23

Views: 33859

Answers (2)

Lee Kowalkowski
Lee Kowalkowski

Reputation: 11751

Depends on browser support, but that's getting pretty good with new browsers: http://jsfiddle.net/3fMeL/2/

var CSV = [
    '"1","val1","val2","val3","val4"',
    '"2","val1","val2","val3","val4"',
    '"3","val1","val2","val3","val4"'
  ].join('\n');

window.URL = window.webkitURL || window.URL;

var contentType = 'text/csv';

var csvFile = new Blob([CSV], {type: contentType});

var a = document.createElement('a');
a.download = 'my.csv';
a.href = window.URL.createObjectURL(csvFile);
a.textContent = 'Download CSV';

a.dataset.downloadurl = [contentType, a.download, a.href].join(':');

document.body.appendChild(a);

So the first item is the Blob object, this creates the object that can be downloaded. https://developer.mozilla.org/en-US/docs/Web/API/Blob (http://caniuse.com/#search=blob)

The next part is the download attribute of the link, which informs the browser to download the CSV file rather than opening it in the browser window. (http://caniuse.com/#feat=download)

Upvotes: 52

Bhavesh G
Bhavesh G

Reputation: 3028

there is jquery plugin for output file at the client side without server side interaction,

https://github.com/dcneiner/Downloadify

Upvotes: -1

Related Questions