FileReader isn't working?

this is frustrating. I've been running this code in Safari, Firefox and Chrome - all latest versions - and it doesn't work. Is it working for anyone else? I'm getting my file reference from <input type='file' id='file' name='file'>

console.log("Have now created a new file reader and it looks like this..." + reader);
reader.onload = function() {
var contents = event.target.result;
console.log("File contents: " + contents );
};
reader.onerror = function(event) {
console.error("File could not be read! Code " + event.target.error.code);
};
reader.readAsText(file);    
}, false);

What am i doing wrong?

Thanks,

J.Wells

Upvotes: 0

Views: 4572

Answers (1)

Bergi
Bergi

Reputation: 664366

What am i doing wrong?

You seem to have forgotten the event parameter of the onload handler. Instead of using event.target, you also might just use reader.

Also, in the fiddle you are creating the FileReader in a very odd way. You might want to read the introduction Using files from web applications at MDN.

document.getElementById("file").addEventListener("change", function(e) {
    var file = e.target.files[0],
        reader = new FileReader();
    console.log("Have now created a new file reader and it looks like this..." + reader);
    reader.onload = function(event) {
//                           ^^^^^
        var contents = event.target.result;
        console.log("File contents: " + contents );
    };
    reader.onerror = function(event) {
        console.error("File could not be read! Code " + event.target.error.code);
    };
    reader.readAsText(file);    
}, false);

Upvotes: 3

Related Questions