Get the filename of a fileupload in a document through JavaScript

Question

var fu1   document getElementById  FileUpload1      How can I get the filename of the fileupload control with id FileUpload1

User · Answer

Using code like this in a form I can capture the original source upload filename  copy it to a second simple input field   This is so user can provide an alternate upload filename in submit request since the file upload filename is immutable        lt input type  file  id  imgup1  name  imagefile  gt        onchange  document getElementsByName  imgfn1   0  value   document getElementById  imgup1   value   gt       lt input type  text  name  imgfn1  value    gt

User · Answer

Try the value property  like this   var fu1   document getElementById  FileUpload1    alert  You selected     fu1 value     NOTE  It looks like FileUpload1 is an ASP Net server-side FileUpload control  If so  you should get its ID using the ClientID property  like this   var fu1   document getElementById   lt    FileUpload1 ClientID   gt

User · Answer

RaYell  You don t need to parse the value returned   document getElementById  FileUpload1   value returns only the file name with extension  This was useful for me because I wanted to copy the name of the file to be uploaded to an input box called  title   In my application  the uploaded file is renamed to the index generated by the backend database and the title is stored in the database

User · Answer

In google chrome element value return the name   the path  but a fake path  Thus  for my case I used the name attribute on the file like below    function getFileData myFile      var file   myFile files 0        var filename   file name      this is the call from the page     lt input id  ph1  name  photo  type  file  class  jq req  onchange  getFileData this     gt

User · Answer

To get only uploaded file Name use this   fake path document getElementById  FileUpload1   value alert fake path split       pop      FileUpload1 value contains fake path  that you probably don t want  to avoid that use split and pop last element from your file

User · Answer

Try document getElementById  FileUpload1   value this value should have a path for a file to be uploaded  just strip all dirs from that value and you will have file name

User · Answer

Try  var fu1   document getElementById  FileUpload1   value

[javascript] Get the filename of a fileupload in a document through JavaScript

Examples related to javascript

Examples related to file-upload