How to get the filename from input type=file html element using JavaScript or JQuery?
firefox, google-chrome, internet-explorer, javascript, jquery
Solution
This should work:
$("input[name='attachment[]']").each(function() {
var fileName = $(this).val().split('/').pop().split('\\').pop();
console.log(fileName);
});
You can't get the full path of the file, because it depends on the browser you use. The only common cross-browser value for an input file is the name of the file.
Problem
In Google Chrome browser, i have tried several way + following and none is giving me the value of the file name which was attached, after validation i will submit the file. But always its undefined or val() does not found.. How to resolve it? ``` console.log($("input[name='attachment[]']")); /* Output: [ <input type="file" name="attachment[]" id="attachment"> , <input type="file" name="attachment[]" id="attachment"> , <input type="file" name="attachment[]" id="attachment"> ] */ $.each($("input[name='attachment[]']"), function(i,v) { console.log(i); console.log(v); //v.val() does not exist... even uploaded a file and showing file }); /* Output: 0 <input type="file" name="attachment[]" id="attachment"> 1 <input type="file" name="attachment[]" id="attachment"> 2 <input type="file" name="attachment[]" id="attachment"> */ return false; ```