Dynamically generate file with javascript?

Question

I am working on a web application for my company that will allow us to do some things with image tags, and I would like to be able to generate the results as a CSV file. I can do this quite easily by dumping CSV data into a div or something on the page and with which the user will copy it. I would prefer that they click the generate button and upload the CSV file, as if they click on the link to the result so that they can more easily just save the file somewhere conveniently.

Is it possible to simulate such things with javascript? I basically want to dynamically generate the file, and then allow them to download it on the client side.

Answer 1

You can create a data: URI with a media type text/csvand either create a link to it or go directly to it in modern browsers.

It will not work in IE. (IE8 may support data:in limited circumstances that may not help you.) For this browser, at least you will need to return to cut-n-paste or the server server.

Answer 2

I have written a small client side CSV generator library that may come in handy. Take a look at http://atornblad.se/github/ (scroll down to the heading that says Client Side CSV File Generator )

FileSaver FileSaver. Eli Gray http://eligrey.com/blog/post/saving-generated-files-on-the-client-side

, CSV , :

var propertyOrder = ["name", "age", "height"];

var csv = new Csv(propertyOrder);

csv.add({ name : "Anders",
          age : 38,
          height : "178cm" });

csv.add({ name : "John Doe",
          age : 50,
          height : "184cm" });

csv.saveAs("people.csv");