3

I am trying to use SheetJS in order to push some js arrays to Excel. I looked at some tutorials and used the source code from SheetJS as an initial test. I have debugged and everything seems to work fine apart from the saveAs() method. Has anyone else had the same problem?

Here are the links I'm using in my HTML:

<link href="Style.css" type="text/css" rel="stylesheet">
<script src="scripts.js"></script>
<script src="data.js"></script>
<script src="xlsx.full.min.js"></script>
<script src="Blob.js"></script>
<script src="FileSaver.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>window.jQuery || document.write(decodeURIComponent('%3Cscript src="js/jquery-3.1.0.min.js"%3E%3C/script%3E'))</script>

And here is my js method for saving the xls file. 

function exportToExcel()
{
var wb = XLSX.utils.book_new();

wb.Props = {
            Title: "SheetJS Tutorial",
            Subject: "Test",
            Author: "Red Stapler",
            CreatedDate: new Date(2017,12,19)
    };

 wb.SheetNames.push("Test Sheet");
 var ws_data = [['hello' , 'world']];  //a row with 2 columns
 var ws = XLSX.utils.aoa_to_sheet(ws_data);
 wb.Sheets["Test Sheet"] = ws;

 //Exporting the Workbook for Downloading
 var wbout = XLSX.write(wb, {bookType:'xlsx',  type: 'binary'});

//Convert to binary Data
function s2ab(s) { 
var buf = new ArrayBuffer(s.length); //convert s to arrayBuffer
var view = new Uint8Array(buf);  //create uint8array as viewer
for (var i=0; i<s.length; i++) view[i] = s.charCodeAt(i) & 0xFF;      //convert to octet
return buf;    
}

saveExcel();
}

function saveExcel()
{
//$("#toExcel").click(function(){
//var FileSaver = require('file-saver');
var filename = $("#input-fileName").val();
saveAs(new Blob([s2ab(wbout)],{type:"application/octet-stream"}),   filename + '.xlsx');
alert('saved');

}

This is what I want to achieve, but for some reason I'm not able to save the file: https://www.youtube.com/watch?v=41rOAt-zCu4

Does it have something to do with the versions of my linked JQuery in combination with fileSaver? In the video they are talking about FileSaver.min.js... but I could only find FileSaver.JS.

Sofia Malmsten
  • 67
  • 8
  • What error do you get? – Alvin Jul 02 '18 at 12:58
  • It says "Uncaught ReferenceError: saveAs is not defined" when I debug it in Chrome – Sofia Malmsten Jul 02 '18 at 13:22
  • Well you answered your question. Add correct reference to FileSaver library. Add a breakpoint at line saveAs and at that point verify filesaver library is loaded. Library ref: [link](https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.min.js) – Alvin Jul 02 '18 at 13:29
  • Thank you :) Now it works perfectly – Sofia Malmsten Jul 02 '18 at 14:18
  • Awesome. Was the issue with library reference? – Alvin Jul 02 '18 at 14:32
  • I tried with a lot of things. But in the end it worked when I removed the export keyword before my first var in the FileSaver file. I am quite new to JavaScript, so I don't really understand why, but that was the difference I could find between the file I had and the one you used in the link above ;) – Sofia Malmsten Jul 02 '18 at 15:11

0 Answers0