Topic: How to restrict number of uploaded files

Hi

Is there any way to block the user so that he cannot upload more than one file. Currently, there is no limit on it.

please reply

Regards,
Eshban

Re: How to restrict number of uploaded files

There are two things you need to do.  When you create the uploader object, you will need to set these two:

multi_selection: false

and

init : {
              FilesAdded: function(up, files) {
                plupload.each(files, function(file) {
                  if (up.files.length > 1) {
                    up.removeFile(file);
                  }
                });
                if (up.files.length >= 1) {
                  $('#pickfiles').hide('slow');
                }
              },
              FilesRemoved: function(up, files) {
                if (up.files.length < 1) {
                  $('#pickfiles').fadeIn('slow');
                }
              }
            },

So the complete code would be something like:

        var uploader = new plupload.Uploader({
            runtimes : 'flash',
            browse_button : 'pickfiles',
            max_file_size : '10mb',
            url : 'some/user/here',
            flash_swf_url: "/javascripts/plupload/plupload.flash.swf",
            init : {
              FilesAdded: function(up, files) {
                plupload.each(files, function(file) {
                  if (up.files.length > 1) {
                    up.removeFile(file);
                  }
                });
                if (up.files.length >= 1) {
                  $('#pickfiles').hide('slow');
                }
              },
              FilesRemoved: function(up, files) {
                if (up.files.length < 1) {
                  $('#pickfiles').fadeIn('slow');
                }
              }
            },
            multi_selection: false,
            multipart: true,
            filters : [
                {title : "Image files", extensions : "jpg,jpeg,gif,png,bmp"}
            ]
        });

Re: How to restrict number of uploaded files

I will stick this one up. Great example.

If you want to see your issue fixed, do not report it here, do it on - GitHub.

Re: How to restrict number of uploaded files

http://www.plupload.com/punbb/viewtopic.php?id=695

Re: How to restrict number of uploaded files

Wow thank you so much iwasrobbed, this forum is great.

Re: How to restrict number of uploaded files

But what if i want multi selection, is there an option to set for flash runtime that allows me to set a limit on this.

Quick example, i want user to upload max 10 files, now it is no problem but i must set it so user can choose one file at a time, what i would want to see is an option for fl runtime that will prevent user from selecting more that 10 files, yet allows to select it at once, is this possible?

Re: How to restrict number of uploaded files

I don't think it's possible - at least it wasn't. All you can do is filter out extra files, after user selects as many as he feels alright.

If you want to see your issue fixed, do not report it here, do it on - GitHub.

Re: How to restrict number of uploaded files

Hi

While reading your forum I've met a lot topics like this one. It seems to me if you wrote about the option "multi_selection" on the page http://www.plupload.com/documentation.php it would decrease number of questions.

Thanks

Re: How to restrict number of uploaded files

This should definitely go to the documentation page. I spent almost 2 hours trying some crazy work arounds smile

Re: How to restrict number of uploaded files

After searching for quite a while on how to limit the amount of files one user can upload, I found this posting. Seems like this is not possible?!

Sure, I can just process later on the amount I want, but what about attacks? What if a user starts uploading hundreds of files at a time. This might put the server in danger of overloading.

It would definatelly be helpful to limit the amount of pictures that can be selected in the interface.

Please correct me if  I am wrong and just don't see an available solution.

Re: How to restrict number of uploaded files

Thanks @iwasrobbed! The code really helped me. I want my users to have limits on uploading and this did the job. big_smile

Re: How to restrict number of uploaded files

I am having the same problem - has anyone else expereinced this?

Re: How to restrict number of uploaded files

I'm with you x_merlin_x,

Spent the past 2 hrs with some of the workarounds posted but can't seem to limit the queue.

I can't believe a max_files or queue_limit option isn't already available. so looks like anyone can upload unlimited files and I'm responsible for removing them later. Not the best customer experience either.

Bummer too, this looked like the perfect solution for my needs until this deal breaker.

Re: How to restrict number of uploaded files

The browsers do not provide any functionality to prevent users from selecting files - or only select a fixed number of files.  The best that any program can do (plupload or any other upload program) is look at what has been selected after the fact and act accordingly.  Ultimately this is not a plupload limitation but a browser limitation.

If you only want them to select a single file you can use the html4 runtime only (i.e. the original file upload capability that was built into browsers).  But you lose a lot of the side benefits that the other runtimes supply like fine grained progress reporting.

Re: How to restrict number of uploaded files

Thanks for your response Mike, I know what you mean but probably didn't explain myself clearly.

What I'm after is a queue limit that I can set to say 5 then if the user selects 6 or more, an alert reminds them that they can only select 5 maximum... much the same as how the max file size alert works.

There are about 3 or 4 workarounds that I have found in this forum, none off which worked for me. The posts were quite old so could possibly be due to an older version perhaps? Not sure.

Last one I tried was:

            uploader.bind('FilesAdded', function(up, files) {
                if (files.length > max)
                     alert('You are allowed to add only ' + max + ' files.');
                uploader.splice(); // reset the queue to zero
            });

Re: How to restrict number of uploaded files

Splice let's you remove as many or as few files as you would like.  You don't have to empty the queue, you can just remove all but the first 5 files for example.  The event binding hasn't changed in a long time so that code snippet should be fine.

Re: How to restrict number of uploaded files

Awesome, thanks Mike.

Seems I had to put it inside an init block but all is well and working great now.

Here's what I have in case it helps anyone else.

// Convert divs to queue widgets when the DOM is ready
$(function() {
    $("#uploader").pluploadQueue({
        // General settings
        runtimes : 'flash,html5,silverlight,browserplus,gears',
        url : './plupload.cfm',
        max_file_size : '25mb',
        chunk_size : '1mb',
        unique_names : true,

        // Resize images on clientside if we can
        resize : {width : 320, height : 240, quality : 90},

        // Specify what files to browse for
        filters : [
            {title : "Audio files", extensions : "mp3,m4a"}//,
            //{title : "Zip files", extensions : "zip"}
        ],

        // Flash settings
        flash_swf_url : './plupload/js/plupload.flash.swf',
        
        init : {
            FilesAdded: function(up, files) {
                var max_files = 2;
                if (files.length > max_files) {
                    alert('You are allowed to add only ' + max_files + ' files.');
                    up.splice(); // reset the queue to zero);
                }
            }
        },

        // Silverlight settings
        silverlight_xap_url : './plupload/js/plupload.silverlight.xap'
    });

    // Client side form validation
    $('form').submit(function(e) {
        var uploader = $('#uploader').pluploadQueue();

        // Files in queue upload them first
        if (uploader.files.length > 0) {
            // When all files are uploaded submit form
            uploader.bind('StateChanged', function() {
                if (uploader.files.length === (uploader.total.uploaded + uploader.total.failed)) {
                    $('form')[0].submit();
                }
            });
                
            uploader.start();
        } else {
            alert('You must queue at least one file.');
        }

        return false;
    });
});

Re: How to restrict number of uploaded files

good luck!

Re: How to restrict number of uploaded files

e...don't know

20 (edited by djot 2012-05-19 08:30:28)

Re: How to restrict number of uploaded files

The solutions given here work. At least if you do not try to add files again, after you added some before. These solutions here will only limit adding files at once (so e.g. 2 at once) but not in total.

To limit max total upload files or addable files, you would have to count files with event BeforeUpload or other suitable.

uploader.bind('FilesAdded', function(up, files) {
    // max files allowed to be uploaded
    var max_files = 2;
    //
    // get amount of files already added to the queue
    // + ignoring the inital text, saying to drop files there which is a li also
    var cur_files = $("#html5_uploader_filelist li").not(".plupload_droptext").length;
    //
    // previous and currently added files sum up to files_total
    var files_total = files.length + cur_files;
    //
    if (files_total > max_files) {
      alert('You are allowed to add only ' + max_files + ' files.');
      up.splice(); // reset the queue to zero);
    }
  });

Ok, and to even make it more complicated, you will have to adjust var max_files = 2 if user had uploaded files before and is not allowed to upload e.g. 10 files in total. So you will have to check first, if user still is allowed to upload more files and how many.

Re: How to restrict number of uploaded files

iwasrobbed wrote:

There are two things you need to do.  When you create the uploader object, you will need to set these two:

multi_selection: false

and

init : {
              FilesAdded: function(up, files) {
                plupload.each(files, function(file) {
                  if (up.files.length > 1) {
                    up.removeFile(file);
                  }
                });
                if (up.files.length >= 1) {
                  $('#pickfiles').hide('slow');
                }
              },
              FilesRemoved: function(up, files) {
                if (up.files.length < 1) {
                  $('#pickfiles').fadeIn('slow');
                }
              }
            },

So the complete code would be something like:

        var uploader = new plupload.Uploader({
            runtimes : 'flash',
            browse_button : 'pickfiles',
            max_file_size : '10mb',
            url : 'some/user/here',
            flash_swf_url: "/javascripts/plupload/plupload.flash.swf",
            init : {
              FilesAdded: function(up, files) {
                plupload.each(files, function(file) {
                  if (up.files.length > 1) {
                    up.removeFile(file);
                  }
                });
                if (up.files.length >= 1) {
                  $('#pickfiles').hide('slow');
                }
              },
              FilesRemoved: function(up, files) {
                if (up.files.length < 1) {
                  $('#pickfiles').fadeIn('slow');
                }
              }
            },
            multi_selection: false,
            multipart: true,
            filters : [
                {title : "Image files", extensions : "jpg,jpeg,gif,png,bmp"}
            ]
        });

Re: How to restrict number of uploaded files

@iwasrobbed Big thanks

Re: How to restrict number of uploaded files

thank you for sharing!

Re: How to restrict number of uploaded files

In iwasrobbed's original loop:

                plupload.each(files, function(file) {
                  if (up.files.length > 1) {
                    up.removeFile(file);

... for more me it is unpredictable which 1 file is not removed.

Instead of making the user retry, how do I just keep the first one (eg: the one the cursor was on when they were dropped)?  It seems that's always the first one in the "files" array.

Re: How to restrict number of uploaded files

Plupload 2.1.2 brings consistency to this part of UI widget.

max_file_count will limit the number of files having status of QUEUED
or UPLOADING, that can be present in the queue at the same time.
Obviously after each upload cycle this number will auto-reset and it
will become possible to add more files. In case it is an undesirable
effect, max_file_count can be combined with multiple_queues which, when
set to false, limits upload cycles to just one.

Until now multiple_queues was set to false automatically, if
max_file_count was other than zero. Now we decoupled these two, so that
they could be used in an arbitrary combination to achieve a desired
result.

If you want to see your issue fixed, do not report it here, do it on - GitHub.