export to CSV with Javascript - Stack Overflow

admin管理员组

文章数量:1356429

I have two functions

1. Exports HTML Table
2. Download CSV file

Unfortunately my file is downloading as "Undefined" with no .csv file type.

The format seems to be fine, since the file can be opened with any text editor and can be seen to have all table data with a ma as a delimitter. Which makes it easy for Excel to take in the file and seperate each column and row.

But I need the file to download with the .csv file extension.

Here are my two functions:

function exportTableToCSV(html, filename) {
    var csv = [];
    var rows = document.querySelectorAll("table tr");

    for(var i = 0; i < rows.length; i++){
        var row = [], cols = rows[i].querySelectorAll("td, th");
        for(var j = 0; j < cols.length; j++){
            row.push(cols[j].innerText);
        }
        csv.push(row.join(","));
    }

    // download csv file
    downloadCSV(csv.join("\n"), filename);
}

function downloadCSV(csv, filename) {
   	    var csvFile;
	var downloadLink;

	csvFile = new Blob([csv], {type:"text/csv"});
	downloadLink = document.createElement("a");
	downloadLink.download = filename;
	downloadLink.href = window.URL.createObjectURL(csvFile);
	downloadLink.style.display = "none";
	document.body.appendChild(downloadLink);
	downloadLink.click();
}

exportTableToCSV('', 'test.csv');

I have two functions

1. Exports HTML Table
2. Download CSV file

Unfortunately my file is downloading as "Undefined" with no .csv file type.

The format seems to be fine, since the file can be opened with any text editor and can be seen to have all table data with a ma as a delimitter. Which makes it easy for Excel to take in the file and seperate each column and row.

But I need the file to download with the .csv file extension.

Here are my two functions:

function exportTableToCSV(html, filename) {
    var csv = [];
    var rows = document.querySelectorAll("table tr");

    for(var i = 0; i < rows.length; i++){
        var row = [], cols = rows[i].querySelectorAll("td, th");
        for(var j = 0; j < cols.length; j++){
            row.push(cols[j].innerText);
        }
        csv.push(row.join(","));
    }

    // download csv file
    downloadCSV(csv.join("\n"), filename);
}

function downloadCSV(csv, filename) {
   	    var csvFile;
	var downloadLink;

	csvFile = new Blob([csv], {type:"text/csv"});
	downloadLink = document.createElement("a");
	downloadLink.download = filename;
	downloadLink.href = window.URL.createObjectURL(csvFile);
	downloadLink.style.display = "none";
	document.body.appendChild(downloadLink);
	downloadLink.click();
}

exportTableToCSV('', 'test.csv');

I believe the issue lies with 'function downloadCSV'. Any help or links to some current working examples are highly appreciated.

• javascript
• csv
• download

Share Improve this question Follow edited Feb 5, 2018 at 20:35 Phillip Thomas 1,4791111 silver badges2121 bronze badges asked Feb 5, 2018 at 19:19 kris_needs_helpkris_needs_help 7111 gold badge11 silver badge88 bronze badges 2

• Your code appears to work fine, what browser are you using? – Phillip Thomas Commented Feb 5, 2018 at 19:32
• how can we tweak this to handle " in the strings? – mesqueeb Commented Aug 12, 2022 at 3:50

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

Did you pass filename to exportTableToCSV like:

exportTableToCSV(null,'test.csv')

See https://jsfiddle/mdearman/d1zpndcu/

In some quick testing, it works in Chrome, but not IE (for what its worth).

本文标签： export to CSV with JavascriptStack Overflow