Develop Reference

Cant load blob as text on js

So, I have a blob as a txt inside a zip. I can access the txt file but I cant open it. I've installed by npm the FileReader and tried something that I saw here on stackoverflow https://stackoverflow.com/questions/23024460/javascript-i-created-a-blob-from-a-string-how-do-i-get-the-string-back-out, but I get nothing neither alerts or logs.
convertInText = (blob) => {
let reader = new FileReader();
reader.readAsText(blob, "ANSI");
reader.onloadend = function(e) {
console.log(reader.result);
};
};
Also imported FileReader and all but no result.

HTML5 file upload script not loading file

Newbie to the HTML5 file upload capability, and finding I cant get a simple xml file uploaded and able to get file contents into console. The expected behaviour is that I'd select an xml file and then see the contents rendered in console. However, I dont ever get to the console.log step - seems the reader never loads? Any suggestions to resolve would be most appreciated.
<input type="file"></input>
<script>
var upload = document.getElementsByTagName('input')[0];
upload.onchange = function (e) {
e.preventDefault();
var file = upload.files[0], reader = new FileReader();
reader.onload = function (event) {
console.log('evt',reader.readAsText(file));
};
return false;
};
</script>

So you're setting the reader.onload event to a function, but you need to call the reader.readAsText() function outside of this.
So for example change your code to:
reader.onload = function(event) {
console.log(event);
};
reader.readAsText(file);
What this does is to tell the reader that when you call reader.readAsText(file) it should run the function you defined with reader.onload.
What you were doing before would never load the file because you were only telling the reader to readAsText inside your function callback that you told it to run when it was already loaded!

Save an uploaded image in a local location

on my webpage an user can upload a image with an input like this:
<input ID="submitBackground" class="imageUploader" type='file'/>
The image shall be saved to my server to C:/TEMP immediately.
I try to get access to the uploaded file, I am so far:
var input = document.getElementById('submitBackground');
$("#submitBackground").change(function() {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
// Something (a stream?) is written in e.target.result;
};
reader.readAsDataURL(input.files[0]);
}
});
I just don't know how to continue, I need to save it local somehow.
Has anyone an idea how to do it?

I have a solution now. I am using this example: http://howtodoinjava.com/2013/05/22/jax-rs-resteasy-file-upload-html-form-example/
Works fine, now saving local is possible.

how does javascript FileReader know which file to read?

Referring to this thread:
Preview an image before it is uploaded
I would like to know how simply calling reader = new FileReader() lets FileReader know which file to read.
The thread link posted above works just fine for me, but when I try the following, FileReader() does not read the input. console.log returns nothing.
Javascript:
function fileReader(input){
var reader = new FileReader();
reader.onload = function(e){
console.log(e.target.result);
};
}
$(function(){
$('#file').change(function(){
fileReader(this);
});
});
HTML:
<input id="file" type="file">
Why doesn't this work?
Is there a way to manually give FileReader() which input DOM to read?

I would like to know how simply calling reader = new FileReader() lets FileReader know which file to read.
It doesn't.
You missed this line from the answer of the question you linked to:
reader.readAsDataURL(input.files[0]);

IE does not like my input and image tags

My Code:
var data = $(input)[0];
var file = data.files[0];
var reader = new FileReader();
reader.onload = function (e) {
value = e.target.result;
try {
top.document.getElementById('formDesignContents').contentWindow.updateFormFromToolbar(CURRENT_ATTRIBUTE, value, opts);
} catch (err) {
alert("error connecting to formDesignContents iframe from the toolbar");
}
}
reader.readAsDataURL(file);
It works in GoogleChrome but not IE. For IE, it does not recognize the attribute files under the input element. The jquery is to dereference a jquery object back into standard html element.
Is there another way to accomplish for IE to work? I can easily do one of those
if(IE){...}else{...}
blocks of code. I just dont see why it doesnt recognize those items.
Has anyone else encountered this?

IE doesn't support FileReader, so I'd expect your script to crash on this line:
var reader = new FileReader();
Unless you are using IE10?
https://developer.mozilla.org/en/DOM/FileReader#Browser_compatibility