0

When attempting to load my filereader function there is no output at all. The error is thrown

Uncaught TypeError: Failed to execute 'readAsText' on 'FileReader': parameter 1 is not of type 'Blob'.

Anyone know how to get around this?

JS code below.

let file;

document.querySelector("#file-input").addEventListener('change',function(){
    // selected files list
    var all_files = this.files;
    if(all_files.length==0){
        alert('Error Thrown: No file selected');
        return;
    }
    file = all_files[0];

    var allowed_types = ['text/plain'];
    if(allowed_types.indexOf(file.type) == -1){
        alert('Error Thrown: Incorrect file type');
        return;
    }
    var max_size_allowed = 2*1024*1024
    if(file.size > max_size_allowed){
        alert('Error Thrown: Exceeded 2MB maximum');
        return;
    }
});

var reader = new FileReader();
// Initiiating file reading
reader.addEventListener('loadstart',function(){
    console.log('File reading initiated');

});

reader.addEventListener('load',function(e){
    var text = e.target.result;
    console.log(text);
});

reader.addEventListener('error', function(){
    alert('Error Thrown: Unable to read file ');
});

reader.addEventListener('progress', function(e){
    if(e.lengthComputable == true){
        var percent_read = Math.floor((e.loaded/e.total)*100);
        console.log(percent_read + '% read');
    }
});

reader.readAsText(file);
Lelio Faieta
  • 6,457
  • 7
  • 40
  • 74
cola465
  • 113
  • 8
  • You're calling `reader.readAsText(file)` as soon as the page loads, but you don't define `file` until a change event is triggered on the file input. – Quentin Jan 13 '20 at 15:09
  • So do I add an onload or put the reader.readastext inside one of the functions? – cola465 Jan 13 '20 at 17:36

0 Answers0