limit number file selections in a file input

Question

Is there a way to limit the number of files you can select using the input file plus the multiple attribute.

<input type="file" accept="image/*" multiple/>

I am aware of one approach that is to check the length of files after selection using the onChange event. While this works I would like to prevent user from selecting more than 5 image files in the file select dialog phase.

Is this possible?

Possible duplicate of [How to limit the maximum files chosen when using multiple file input](https://stackoverflow.com/questions/10105411/how-to-limit-the-maximum-files-chosen-when-using-multiple-file-input) — , Jan 21 '19 at 15:51
Probably not the answer you'd like, but you could check `onChange` if the `value` array contains more than 5 elements and if so just `slice` the additional elements off — Ahmed Bajra, Jan 21 '19 at 15:53

score 2 · Answer 1 · answered Jan 21 '19 at 15:57

Unfortunately there is no way if limiting the input field as specified in W3C. At least not without Javascript. The following would work but is probably not as nice as you would have liked:

<input type="file" onchange="checkFiles(this.files)">

function checkFiles(files) {       
    if(files.length>5) {
        alert("length exceeded");
        files.slice(0,5);
        return false;
    }       
}

limit number file selections in a file input

1 Answers1