Get the filename of a fileupload in a document through JavaScript
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("<%= FileUpload1.ClientID %>");
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 :
<input id="ph1" name="photo" type="file" class="jq_req" onchange="getFileData(this);"/>
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.
<input type="file" id="imgup1" name="imagefile">
onchange="document.getElementsByName('imgfn1')[0].value = document.getElementById('imgup1').value;">
<input type="text" name="imgfn1" value="">
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.