How do I limit the number of file upload in html? [duplicate] - html

Question

This question already has answers here:
Count and limit the number of files uploaded (HTML file input)
(4 answers)
Closed 5 years ago.
I want to limit user to select up to 6 files in the input tag. Currently, my input tag is like this:
<input type="file" name="question_pic" id="id_question_pic" multiple/>
I would like to limit user to select up to 6 files. I can return an error on the server side but I want client side to change it first.
Is there a way to do that?
Thanks.

Answer 1

You can use a jQuery function like this:
$('.fileinput').change(function(){
if(this.files.length>10)
alert('Too many files')
});
// Prevent submission if limit is exceeded.
$('form').submit(function(){
if(this.files.length>10)
return false;
});

Answer 2

You can use Jquery or Javascript for that like this:
<input type="file" name="question_pic" id="id_question_pic" max-uploads = 6/>
Then in Jquery You can do this like this
Var number_of_uploads;
$("#id_question_pic").change(function() {
if(number_of_uploads > $(this).attr(max-uploads))
{
alert('Your Message');
}
else
{
number_of_uploads = number_of_uploads + 1;
}
});
You can also do this on your form submission in which you are uploading the file. But if you are using Ajax upload this is fine I think.