Convert JavaScript variable value to csv file

Question

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

Is that syntax what you want really? All those valN strings are useless...Check jsbin.com/ifenic/1/edit — elclanrs
– elclanrs, Commented Jun 14, 2013 at 7:38
There i no way to do this. Otherwise we would be living in the world with viruses compiling directly in your browser — ooops
– ooops, Commented Jun 14, 2013 at 7:43
i have comma separated value in js file want to save this data as csv — RavatSinh Sisodiya
– RavatSinh Sisodiya, Commented Jun 14, 2013 at 7:43
Well, your syntax doesn't even make sense. Try building your own solution first, look on Google for documentation. When you think you've tried all possible solutions, then come back with the code that failed, post a live example and explain what didn't work. That's how Stackoverflow works; you need to show some effort first. — elclanrs
– elclanrs, Commented Jun 14, 2013 at 7:47

Lee Kowalkowski · Accepted Answer · 2013-06-14 08:28:56Z

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)

Thank you very much! is this possible without link (download csv link)?
@RSSisodiya You can create a link and fire the click event on it. You need a link to take advantage of the download attribute. If you put the URL directly in to the browser window.location.href it will just open, and not download.

Bhavesh G · Accepted Answer · 2013-06-14 07:51:04Z

-1

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

https://github.com/dcneiner/Downloadify

answered Jun 14, 2013 at 7:51

Bhavesh G

3,0285 gold badges47 silver badges69 bronze badges

Collectives™ on Stack Overflow

Convert JavaScript variable value to csv file

jsFiddle

2 Answers 2

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Linked

Related