Restricting file types in JQuery File upload demo

Faisal Memon picture Faisal Memon · Sep 6, 2012 · Viewed 47.1k times · Source

I am using JQuery file upload demo for my next project with Codeigniter. Can anyone tell me how do I achieve the following :

  • Restricting upload file types to .zip and .rar
  • Restricting file size
  • Clearing the list of Uploaded files (JQuery file upload plugin displays the list of already uploaded files)

Help appreciated !!

Answer

Dav.id picture Dav.id · Jan 21, 2013

you probably have a plethora of solutions now, however I wanted to use the BASIC plugin for the jquery uploader, i.e. without any other scripts.. for some reason the maxFileSize/fileTypes options were not working - however that is mostly no doubt to my lack of reading the documentation!

Anyway for me, it was as quick as doing the following:

    add: function (e, data) {
        var goUpload = true;
        var uploadFile = data.files[0];
        if (!(/\.(gif|jpg|jpeg|tiff|png)$/i).test(uploadFile.name)) {
            common.notifyError('You must select an image file only');
            goUpload = false;
        }
        if (uploadFile.size > 2000000) { // 2mb
            common.notifyError('Please upload a smaller image, max size is 2 MB');
            goUpload = false;
        }
        if (goUpload == true) {
            data.submit();
        }
    },

So just using the ADD option to only allow the image types in the regex, and checking (in my case) the file size is a max of 2mb.

Rather basic, and again I am sure the maxFileSize options work, just I am only including the basic plugin script jquery.fileupload.js

EDIT I should have added in my case I am uploading just one file (a profile image) so hence the data.files[0].. you could iterate through the files collection of course.