Click here to Skip to main content
15,881,173 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi,
I want to create file using javascript
found this link

http://jsfiddle.net/UselessCode/qm5AG/[^][^]
want to use this javascript function
I put it into script table

HTML
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title></title>
        <script>
            (function () {
var textFile = null,
  makeTextFile = function (text) {
    var data = new Blob([text], {type: 'text/plain'});

    // If we are replacing a previously generated file we need to
    // manually revoke the object URL to avoid memory leaks.
    if (textFile !== null) {
      window.URL.revokeObjectURL(textFile);
    }

    textFile = window.URL.createObjectURL(data);

    return textFile;
  };


  var create = document.getElementById('create'),
    textbox = document.getElementById('textbox');

  create.addEventListener('click', function () {
    var link = document.getElementById('downloadlink');
    link.href = makeTextFile(textbox.value);
    link.style.display = 'block';
  }, false);
})();
    </script>
    </head>
    <body>
        <textarea id="textbox">Type something here</textarea> <button id="create" >Create file</button> 
        <a download="info.txt" id="downloadlink" style="display: none">Download</a>
    </body>
</html>

but it's not working download link doesn't appear
any help ?
Posted

1 solution

Problem


If you see the left side panel under "Frameworks and Extensions" section, it says that "No-Library (pure JS)" is used and script will be activated on "onLoad". This thing is automatically handled by jsfiddle website.

But if you run the page in browser and see the console of developer tool, it will point out the below issue...
HTML
TypeError: create is null

create.addEventListener('click', function () {

Solution


So, we just need to call the script on window onload like.
JavaScript
window.onload = function(){
            var textFile = null,

            makeTextFile = function (text) {
                                var data = new Blob([text], {type: 'text/plain'});

                                // If we are replacing a previously generated file we need to
                                // manually revoke the object URL to avoid memory leaks.
                                if (textFile !== null) {
                                  window.URL.revokeObjectURL(textFile);
                                }

                                textFile = window.URL.createObjectURL(data);

                                return textFile;
                            };

            var create = document.getElementById('create'),
            textbox = document.getElementById('textbox');

            create.addEventListener('click', function () {
                                                var link = document.getElementById('downloadlink');
                                                link.href = makeTextFile(textbox.value);
                                                link.style.display = 'block';
                                            }, false);
        };

Demo


[Demo] Generate File in JavaScript[^]
 
Share this answer
 
v3
Comments
Heba Kamel 15-Apr-15 8:40am    
It works well now
thank you so much Tadit :)
Most welcome buddy. :)
hypermellow 15-Apr-15 9:09am    
Great solution - Nail, Head, Hit & 5'ed! :-)
Thanks a ton man. :)

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900