SlickGrid functions for CSV export?

Question

Within a Django application, I'm using SlickGrid to bind some XHR data to a client-side spreadsheet:

 var grid;
 var review_url = '/api/reviews/?t=' + current_tcode;
 $.getJSON(review_url, function(data) {
   grid = new Slick.Grid("#myGrid", data, columns, options);
 });

I'd also like to give the user the option to download the data as a CSV file. What is the best approach to doing this?

Simply link to a CSV file that I render myself (with Piston, which I'm already using for the API).
Do something clever using SlickGrid to output CSV data on the client side.
Something else.

SlickGrid feels fully-featured enough that it might have something in-built to output CSV, but I can't find anything on a quick search.

score 4 · Answer 1 · answered Jul 15 '15 at 05:43

For export to CSV you may use this function:

$("#exporticon").click(function() {
    var processRow = function (row) {
        var finalVal = '';
        for (var j = 0; j < row.length; j++) {
            var innerValue = row[j] === null ? '' : row[j].toString();
            if (row[j] instanceof Date) {
                innerValue = row[j].toLocaleString();
            };
            var result = innerValue.replace(/"/g, '""');
            if (result.search(/("|,|;|\n)/g) >= 0)
                result = '"' + result + '"';
            if (j > 0)
                finalVal += ',';
                finalVal += result;
        }
        return finalVal + '\n';
    };

    var csvFile = '';
    var rows = [];
    var colname = [];
    for (var j = 0, len = grid.getColumns().length; j < len; j++) {
        colname.push(grid.getColumns()[j].name);
    }
    rows.push(colname);
    var singlerow = [];
    for (var i = 0, l = dataView.getLength(); i < l; i++) {
        for (var j = 0, len = grid.getColumns().length; j < len; j++) {
            singlerow.push(grid.getDataItem(i)[grid.getColumns()[j].field]);
        }
        rows.push(singlerow);
        singlerow = [];
    }

    for (var i = 0; i < rows.length; i++) {
        csvFile += processRow(rows[i]);
    }

    var blob = new Blob([csvFile], { type: 'text/csv;charset=utf-8;' });
    if (navigator.msSaveBlob) { // IE 10+
        navigator.msSaveBlob(blob, "filename.csv");
    } else {
        var link = document.createElement("a");
        if (link.download !== undefined) { // feature detection
            // Browsers that support HTML5 download attribute
            var url = URL.createObjectURL(blob);
            link.setAttribute("href", url);
            link.setAttribute("download", "filename.csv");
            link.style.visibility = 'hidden';
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
        }
    }
});

this is working pretty well for me. One change I made was to line #5 of the above code: `var innerValue = row[j] === null || typeof row[j] == 'undefined' ? '' : row[j].toString();` — phirschybar, Sep 08 '15 at 02:09

score 3 · Answer 2 · answered Jul 17 '12 at 02:19

3

You may want to look at this: CellExternalCopyManager is a SlickGrid plugin to copy/paste data from/to MS Excel (or compatible)

answered Jul 17 '12 at 02:19

ZiglioUK

2,573
4
27
32

score 2 · Accepted Answer · edited May 23 '17 at 12:22

SlickGrid is purely a component for visualization. Feed it the data, and it will render it as a grid to the user. Heck, it isn't even smart enough to sort the data.

As such, it has no functionality to transform data in any way. So if you want to get the grid data in CSV format you have two options:

Option 1. Render the CSV client-side by generating it directly form the underlying data array. Since you're already returning the data in json format, you should be able to do this pretty easily with something like this.

-or-

Option 2. Render the CSV server-side and make it accessible via url, possible by adding a formatting parameter to your review_url.

I don't know of any functionality in the grid that will help you here, but maybe someone will correct me.

score 0 · Answer 4 · answered Jul 16 '12 at 11:33

0

In my opinion if You want only CSV - render it on the server.
Also You may find this railscasts episode interesting - only find tools suitable for Django to do this.

answered Jul 16 '12 at 11:33

matma

1,104
1
10
17

SlickGrid functions for CSV export?

4 Answers4