Create Text file from String using JS and html5

Question

i want to create a text file from a string. currently i am using a function which takes an array and makes it into a string then using that string i want to create a local text file the user downloads. i have tried using this method

   function createFile(){ //creates a file using the fileLIST list 
    var output= 'Name \t Status\n'+ fileLIST[0][0].name+'\t'+fileLIST[0][1]+'\n';
    var Previous = fileLIST[0];
    for (var i=1; i<fileLIST.length; i++)
        if (fileLIST[i][1] =='none' || fileLIST[i][1] == Previous[1])
            continue
        else {
            Previous = fileLIST[i]
            output = output + fileLIST[i][0].name +'\t'+fileLIST[i][1] + '\n';}

    window.open("data:text/json;charset=utf-8," + escape(output));//should create file
    display();  }

i am using chrome as my browser. also i would prefer JS or HTML5 answer.

thank you in advance

it opens a new tab and doesn't do anything. it is not creating a file to download — GreenGiant
– GreenGiant, Commented May 18, 2012 at 15:08
no it is all local. i have include the --allow-file-access-from-files in chrome to see if that would help but no. — GreenGiant
– GreenGiant, Commented May 18, 2012 at 15:10

Anis Abboud · Accepted Answer · 2015-02-10 01:42:25Z

45

Convert your object to a JSON string.

var json_string = JSON.stringify(object, undefined, 2);

Notes:

If you already have a string, skip the step above.
If you don't want it to be formatted nicely, remove the , undefined, 2.

Create a download link and click it:

var link = document.createElement('a');
link.download = 'data.json';
var blob = new Blob([json_string], {type: 'text/plain'});
link.href = window.URL.createObjectURL(blob);
link.click();

answered Feb 10, 2015 at 1:42

Anis Abboud

1,3782 gold badges16 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

jiehanzheng · Accepted Answer · 2013-06-21 20:00:48Z

5

BlobBuilder is now obsolete. Use this instead:

https://developer.mozilla.org/en-US/docs/Web/API/Blob#Blob_constructor_example_usage

answered Jun 21, 2013 at 20:00

jiehanzheng

1,00314 silver badges12 bronze badges

Comments

GreenGiant · Accepted Answer · 2012-05-22 18:38:41Z

4

i ended up using this code instead. it creates a link to download the url of the file.

     window.URL = window.webkitURL || window.URL;
    window.BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder ||       window.MozBlobBuilder;
    file = new WebKitBlobBuilder();
    file.append(output); 
    var a = document.getElementById("downloadFile");
    a.hidden = '';
    a.href = window.URL.createObjectURL(file.getBlob('text/plain'));
    a.download = 'filename.txt';
    a.textContent = 'Download file!';
}

also this way adds less to the website making it a lighter website for slow connections. my html has a empty div in which this appends to.

   <div class ='paginationLIST' id='pagination'></div>

answered May 22, 2012 at 18:38

GreenGiant

5211 gold badge4 silver badges13 bronze badges

1 Comment

Andrea Rastelli Over a year ago

maybe i miss something, but the code souldn't be something like: file = new BlobBuilder because you have assigned to this object the Webkit or Moz BlodBuilder.. Am I right?

Collectives™ on Stack Overflow

Create Text file from String using JS and html5

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related