Problems with HTML5 FileReader

Question

I try to run the FileReader function in my project but it only works pas.Mon project works like so I list all files in a directory. It all works. But when I select a file in the list (my files are local), I end up with this error I do not understand:

Uncaught TypeError: Failed to execute 'readAsText' on 'FileReader': The argument is not a Blob.

Here is my code:

GetFileName function (fs) {
     var target = event.target || event.srcElement;

     var childs = target.parentNode.childNodes;
     {for (i = 0; i ++; i <childs.length)
         if (target == childs [i]) break;
     }

     console.log (i); // Index li
     console.log (event.target.innerHTML); // li value

     filename = "~ / Downloads / snippets" + event.target.innerHTML;

var fr = new FileReader ();
fr.onload = function (e) {
     console.log (e.target.result);
};
fr.readAsText (filename);
}

Does anyone have an idea of what does not work?

Thank you in advance for your help!

The error seems clear enough. You can't feed a filename to it. It expects a Blob representation of a file or a File object. — Xan
– Xan, Commented Nov 6, 2014 at 15:38

ATG · Accepted Answer · 2014-11-06 16:18:53Z

7

I think the problem is that your filename variable is set to:

filename = "~ / Downloads / snippets" + event.target.innerHTML;

...which is a String, rather than the object that's expected by the readAsText function on FileReader.

Try something like this instead:

var fileInputElement = document.getElementById("fileInputElement");
fr.readAsText(fileInputElement.files[0]);

Where "fileInputElement" is the ID of the HTML <input> element of type file.

This may not fit exactly with what you're doing, but it's not easy to tell without seeing more of your JavaScript and HTML.

edited Nov 6, 2014 at 16:18

answered Nov 6, 2014 at 15:54

ATG

1,70715 silver badges27 bronze badges

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

Collectives™ on Stack Overflow

Problems with HTML5 FileReader

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related