How to access data from input function in javascript [duplicate]

Question

If I upload data (say a text file) from my local computer, with this function

var button = document.getElementById('myFile');

<p id = "out">The content of the file is</p>
<input type = "file" id = "myFile" style="margin-top:5%;">

How do I retrieve data from the uploaded file? I'm thinking about the simplest case which can be a text file to be appended to a div.

upload it first to server, then parse it on server side (u may upload image, video and so on). Then create PHP (for example) or any other ajax handler that returns file content and call this action via JS — Evgeniy
– Evgeniy, Commented Dec 11, 2014 at 9:51
@Evgeniy Not necessarily so: modern browsers have FileReader that allows the browser to parse uploaded files. However, sometimes it might not be a good idea to read the entire file into memory—if it's too large you'll risk crashing the browser due to memory overflow. — Terry
– Terry, Commented Dec 11, 2014 at 9:53
@Evgeniy Of course, it is not supported across all browsers. If OP wants total cross-browser compatibility, your solution might be a better way :) but since OP only cited the example of a text file, FileReader is sufficient. Also, the case is different if OP wants to parse other kinds of files. — Terry
– Terry, Commented Dec 11, 2014 at 9:56

Mimouni · Accepted Answer · 2014-12-11 09:53:09Z

-1

try this with jquery :

$('input[type=file]').change(function () {
    console.log(this.files[0].mozFullPath);
});

or

$('input[type="file"]').change(function(){
  console.log($(this).closest('.browse-wrap').next('.upload-path').text(this.value));
});

answered Dec 11, 2014 at 9:53

Mimouni

3,6483 gold badges32 silver badges37 bronze badges

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

2 Comments

Mimouni Over a year ago

why -1 ,can you comment !

Quentin Over a year ago

You're using browser prefixed properties without covered the cross-browser or standard cases and the code you've provided won't give access to the content of the file anyway.

Collectives™ on Stack Overflow

How to access data from input function in javascript [duplicate]

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related