jQuery grab a file uploaded with input type='file'

Question

I want to grab the file uploaded in a tag.

When I do $(\'#inputId\').val(), it only grabs the name of the file, not the

Answer 1

This is likely referring to HTML5 files property. See w3 and sample jsfiddle

Answer 2

Use event.target.files for change event to retrieve the File instances.

$('#inputId').change(function(e) {
  var files = e.target.files; 

  for (var i = 0, file; file = files[i]; i++) {
    console.log(file);
  }
});

Have a look here for more info: http://www.html5rocks.com/en/tutorials/file/dndfiles/

This solution uses File API which is not supported by all browser - see http://caniuse.com/#feat=fileapi .