从 CSV 导入到 HandsOnTable 并从 HandsOnTable 导出到 CSV答案

【问题标题】：Import from CSV into HandsOnTable and Export to CSV from HandsOnTable从 CSV 导入到 HandsOnTable 并从 HandsOnTable 导出到 CSV
【发布时间】：2015-05-23 16:04:55
【问题描述】：

我使用http://handsontable.com/ 作为显示我的项目价格的小部件之一，我在他们的 API 或常见问题解答中找不到从 CSV 功能导出和导入。有没有人实施或知道它？

【问题讨论】：

这是关于将数据下载为 .csv stackoverflow.com/questions/12353239/… 的好答案

标签： handsontable

【解决方案1】：

是的，该评论将您链接到有关如何执行此操作的说明，here 是我为任何只想重用代码的人实现的。除了基本的 CSV 导出之外，还有一些增强功能，例如转义空格和特殊字符以及撇号。如果存在列标题，它还会设置列标题，因此如果没有列标题，请删除该行。

相关代码假设您有一个 id=export-csv 的按钮：

function parseRow(infoArray, index, csvContent) {
    var sizeData = _.size(hot1.getData());
    if (index < sizeData - 1) {
        dataString = "";
        _.each(infoArray, function(col, i) {
            dataString += _.contains(col, ",") ? "\"" + col + "\"" : col;
            dataString += i < _.size(infoArray) - 1 ? "," : "";
        })

        csvContent += index < sizeData - 2 ? dataString + "\n" : dataString;
    }
    return csvContent;
}

/**
 * Export to CSV button
 */
var exportCsv = $("#export-csv")[0];
if (exportCsv) {
    Handsontable.Dom.addEvent(exportCsv, "mouseup", function(e) {
        exportCsv.blur(); // jquery ui hackfix
        var csvContent = "data:text/csv;charset=utf-8,";
        csvContent = parseRow(colHeaders, 0, csvContent);  // comment this out to remove column headers
        _.each(hot1.getData(), function(infoArray, index) {
            csvContent = parseRow(infoArray, index, csvContent);
        });
        var encodedUri = encodeURI(csvContent);
        var link = document.createElement("a");
        link.setAttribute("href", encodedUri);
        link.setAttribute("download", $("h1").text() + ".csv");
        link.click();
    })
}

希望对你有帮助！

【讨论】：