CODEWITHSUNDEEP
javascripthtmlfilefile-uploadinput
bool3max
bool3max

Reputation: 2865

How to get names of all files in the <input type="file"> input that has the multiple attribute?

I have a input with the multiple attribute on my page: 

<input type="file" accept="video/*" required multiple id="input-file-video">

If the user selects, let's say, 3 files at once, the input is going to display just : "3 files selected", but I want to get the names of all files that are selected. I also tried accessing the value property of the input:

document.getElementById("input-file-video").value;

But that returns just the name of the first file.

Is there any way to do this?

Upvotes: 1

Views: 5969

Answers (1)

Lucky
Lucky

Reputation: 17345

Try this,

var inp = document.getElementById('input-file-video');
for (var i = 0; i < inp.files.length; ++i) {
  var name = inp.files.item(i).name;
  alert("file name: " + name);
}

In jQuery, $('#input-file-video').get(0).files; will return the list of files that are uploaded. So you can loop through and get the files names.

Upvotes: 3

Related Questions