How to limit the number of file uploads in html?

I want to limit the user to 6 files in the input tag. Currently, my input tag is as follows:

<input type="file" name="question_pic" id="id_question_pic" multiple/>

I would like to limit the user to 6 files. I can return the error on the server side, but first I want the client side to change it.

Is there any way to do this?

Thank.

+5
source share
2 answers

You can use the jQuery function as follows:

$('.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;
});
+5
source

You can use jquery or javascript to do this:

<input type="file" name="question_pic" id="id_question_pic" max-uploads = 6/>

Then in jQuery you can do it 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 in your view of the form in which you upload the file. But if you use Ajax download, that’s fine, I think.

+1

All Articles