jQuery validation-plugin: validating multiple input files

Question

I would like to ask how to validate multiple file input using the jQuery validation-plugin.

Currently I have these codes but it doesn\'t work:

.html:

Answer 1

You need to 'files[]' instead of files, and if you doesn't add additional-methods.js, you will do it.

  $('#uploadPhotoForm').validate({
    rules: {
      'files[]': {
      required: true,
      extension: "png"
    }
    },
    messages:{
        'files[]':{
           required : "Please upload atleast 1 photo",
           extension:"Only png file is allowed!"
        }

    }

See jsFiddle.

About serialize. Please read this how to do file upload using jquery serialization

Update:

It will work

if ($('#uploadPhotoForm').valid()) {  
    var form = $('#uploadPhotoForm')[0]; //  [0], because you need to use standart javascript object here
    var formData = new FormData(form);
    $.ajax({
        url: "inc/uploadPhoto.php",
        type: "POST",
        data:  formData,
        contentType: false,
        cache: false,
        processData:false,
        success: function(data){
           $("#error1").html(data);
        }           
    });
}

Your code haven't work i think because this in data: new FormData(this), not valid javascript form object.