Is it possible to use any HTML5 fanciness to export local storage to Excel?

Question

This question is similar, but doesn't highlight any possibilities to export the data. Thoughts?

Answer 1

I think you're misunderstanding the answer to the question you linked to, it's suggesting you use a Data URI for export.

Excel is a bit of a complicated target to aim for as the file format is itself binary ( or OOXML ). If you just want something that opens in Excel then you can export the more straightforward CSV as a data URI. The following code is a bit rough and ready and has only been tested in Firefox:

function exportData() {
    var data = '';
    for (var i=1;i<=2;i++) {
        var sep = '';
        for (var j=1;j<=4;j++) {
            data +=  sep + document.getElementById(i + '_' + j).value;
            sep = ',';
        }
        data += '\r\n';
    }
    var exportLink = document.createElement('a');
    exportLink.setAttribute('href', 'data:text/csv;base64,' + window.btoa(data));
    exportLink.appendChild(document.createTextNode('test.csv'));
    document.getElementById('results').appendChild(exportLink);
}

Here's the page markup:

<input type="number" id="1_1" value="2">,
<input type="number" id="1_2" value="1">,
<input type="number" id="1_3" value="4">,
<input type="number" id="1_4" value="3">
<br>
<input type="number" id="2_1" value="1">,
<input type="number" id="2_2" value="2">,
<input type="number" id="2_3" value="3">,
<input type="number" id="2_4" value="4">
<br>
<button onclick="exportData()">Export as CSV</button>
<div id="results"></div>

Demo here . Click the button you get a link, click the link and you get a file. Change the values, click the link again and you get a different file. Firefox made me select Excel every time to open it but I don't know whether that's my configuration or a general issue.

_{(source: boogdesign.com )}

Like I said, only tested in Firefox, and it will only work in browsers which support Data URIs . You also need the window.btoa() function or implement your own base64 encoder .

Answer 2

I'm not aware of any Javascript libraries which can make an Excel file. But you could simply export it as HTML or CSV - note that Javascript cannot make files (yet), but the working draft of HTML caters for this: http://www.w3.org/TR/file-writer-api/

Excel is quite good at reading tables made in HTML, so you could simply do that and open the HTML file with Excel.

You can create a file for download using Downloadify: https://github.com/dcneiner/Downloadify