Search code examples
jqueryfile-uploadblueimp

jQuery File Upload - validate filesize and extension


I'm using jQuery File Upload, my code is:

$(function(){

        var ul = $('#upload ul');
     // Initialize the jQuery File Upload plugin
        $('#upload').fileupload({
            maxFileSize: 500,
            acceptFileTypes:  /(\.|\/)(gif|jpe?g|png)$/i,
            formData: {
                action: 'ja_upload_doc',
                cv_id: $('#cv_id').val(),
                first_name: $('#first_name').val(),
                last_name: $('#last_name').val(),
            },
            // This element will accept file drag/drop uploading
            dropZone: $('#drop'),

            // This function is called when a file is added to the queue;
            // either via the browse button, or via drag/drop:
            add: function (e, data) {

                // Automatically upload the file once it is added to the queue
                var jqXHR = data.submit().success(function (result, textStatus, jqXHR) {
                    console.log('Done');
               });
            },

            progress: function(e, data){
            },
            done:function(e, data){

                console.log(data);
            },
            fail:function(e, data){
                // Something has gone wrong!
                data.context.addClass('error');
            }

        });

    });

I'm including

  • jquery.ui.widget.js
  • jquery.iframe-transport.js
  • jquery.fileupload.js
  • jquery.fileupload-ui.js
  • jquery.fileupload.css

Is there anything else I need to include to make the Validation work? Or is there something wrong with my code?


Solution

  • You need to include jquery.fileupload-process.js and jquery.fileupload-validate.js files in this order to be able to validate.