JQuery - File attributes

JimmyJammed picture JimmyJammed · Dec 8, 2011 · Viewed 114.2k times · Source

Trying to access file attributes from an input field after a file is selected. Tried this but get the error 'file not defined'

var file = $("#uploadedfile").prop("files")[0];
var fileName = file.fileName;
var fileSize = file.fileSize;
alert("Uploading: "+fileName+" @ "+fileSize+"bytes");

Answer

adeneo picture adeneo · Dec 8, 2011

If #uploadedfile is an input with type "file" :

var file = $("#uploadedfile")[0].files[0];
var fileName = file.name;
var fileSize = file.size;
alert("Uploading: "+fileName+" @ "+fileSize+"bytes");

Normally this would fire on the change event, like so:

$("#uploadedfile").on("change", function(){
   var file = this.files[0],
       fileName = file.name,
       fileSize = file.size;
   alert("Uploading: "+fileName+" @ "+fileSize+"bytes");
   CustomFileHandlingFunction(file);
});

FIDDLE