Javascript - Download CSV as File

javascript export-to-csv
coffeemonitor picture coffeemonitor · Jan 17, 2014 · Viewed 29.9k times · Source

I'm messing with some javascript to download some csv text:

<script>
var data = '"Column One","Column Two","Column Three"';
window.location.href = 'data:text/csv;charset=UTF-8,' + encodeURIComponent(data);
</script>

So far this is working, but as the browser prompts me to save the file, there is no filename, nor extension.

How can I predetermine the name of the file and it's extension, inside the window.location.href ?

Answer

Andrew picture Andrew · Jan 17, 2014 
function downloadFile(fileName, urlData) {

    var aLink = document.createElement('a');
    var evt = document.createEvent("HTMLEvents");
    evt.initEvent("click");
    aLink.download = fileName;
    aLink.href = urlData;
    aLink.dispatchEvent(evt);
}

var data = '"Column One","Column Two","Column Three"';
downloadFile('2.csv', 'data:text/csv;charset=UTF-8,' + encodeURIComponent(data));

http://jsfiddle.net/rooseve/7bUG8/

Related questions

Export javascript data to CSV file without server interaction

If we were on a nodeJS server, we could write a header, set a mime type, and send it: res.header("Content-Disposition", "attachment;filename="+name+".csv"); res.type("text/csv"); res.send(200, csvString); and because of the headers, the browser …

Read More
export html table to csv

I am trying to add a feature of csv download option in my website. It should convert the html table present in the website in to csv content and make it downloadable. Ive been searching through internet for a good …

Read More
Javascript to csv export encoding issue

I need to export javascript array to excel file and download it I'm doing it in this code. data is a javascript object array. var csvContent = "data:text/csv;charset=utf-8,"; data.forEach(function(dataMember, index) { dataString = dataMember.join(","); csvContent += …

Read More