Validating array file input

Question

How can I validate an array of file input with jquery.validate plugin?

The code works fine with single file, but not with multiple upload, where name="" is an array.

jQ:

<script type="text/javascript">
    $(document).ready(function(){
        $("#Main").validate({
            rules: {
                pic: { required:true, accept: "jpg|jpeg" }
            }}
        );
    });
</script>

Single upload:

<html>
    <head>
    </head>
    <body>
        ...
        <td>Fotografija 1:</td>
        <td> <input type="file" class="fup" name="pic" /> </td>
        ...
    </body>
</html>

Multiple upload

<html>
    <head>
    </head>
    <body>
        ...
            <td>Fotografija 1:</td>
            <td> <input type="file" class="fup" name="pic[]" /> </td>
        </tr>
        <tr>
            <td>Fotografija 2:</td>
            <td> <input type="file" class="fup" name="pic[]" /> </td>
        </tr>
        <tr>
            <td>Fotografija 3:</td>
            <td> <input type="file" class="fup" name="pic[]" /> </td>
        ...
    </body>
</html>

read [this](http://docs.jquery.com/Plugins/Validation) – Simon Dorociak May 28 '12 at 10:50 — Simon Dorociak, May 28 '12 at 10:50

score 0 · Accepted Answer · edited May 23 '17 at 11:56

0

You can try this:

 $("input.fup").each(function(){
       $(this).rules("add", {
           required:true, 
           accept: "jpg|jpeg"
       });                    
 });

For detail see here

Here is another resource.

edited May 23 '17 at 11:56

Community

1
1

answered May 28 '12 at 10:57

thecodeparadox

86,271
21
138
164

3

It still works just for the first file input in my case. Other two ("fotografija1, fotografija2") are not validated. :/ – John May 28 '12 at 11:08
1

It only validates the first input when the `name` attribute is used multiple times. This plugin requires that naming be unique; there is no workaround! The first question you linked to in your answer is about editing the core of the plugin itself. – Sparky Sep 17 '18 at 14:48
1

Answer should be fixed or deleted. Your first link says to edit the plugin itself, which only proves this cannot be done with this plugin. The second link shows unique names, which is not what the OP is doing here. Finally, read the first comment on this answer above... proof: [your solution just does not work when field name is repeated. https://jsfiddle.net/gbxnadwo/](https://jsfiddle.net/gbxnadwo/) – Sparky Jul 30 '19 at 18:31

Maxim Pokrovskii · Answer 2 · 2013-09-16T11:47:17.407

Have some issue here

"pic[]" {your rules}

and

rules("add)

wokring only for first element in array.

===

ok i found out solution: you should fix jquery.validate.js

Find checkForm function

and replace it to:

        checkForm: function() {
        this.prepareForm();
        for ( var i = 0, elements = (this.currentElements = this.elements()); elements[i]; i++ ) {
            if (this.findByName( elements[i].name ).length != undefined && this.findByName( elements[i].name ).length > 1) {
                for (var cnt = 0; cnt < this.findByName( elements[i].name ).length; cnt++) {
                    this.check( this.findByName( elements[i].name )[cnt] );
                }
            } else {
                this.check( elements[i] );
            }
        }
        return this.valid();
    },

I have tried to modify the validate.js but it was not working for me — Techy, May 23 '18 at 06:41

Validating array file input

2 Answers2