0
<html>
<script src = "/jquery.js"></script>
    <form>
        Image here:<br>
        <input type = "file" id = "image" multiple><br>
        <input type = "button" id = "submit" value = "submit">
    </form>
</html>

<script>

$("#submit").click(function(){
    var form = new FormData();
    var filescount = $("#image")[0].files.length;

    for (var i = 0;i<=(filescount-1);i++){
        form.append( "finalform" , $("#image")[0].files[i]  );
    }

    $.post({
        url:"/test.php",
        processData: false,
        contentType: false,
        data:form,
        success:function(data){
            alert(data);
        }
    });


});
</script>

<?php
var_dump($_FILES);
?>

My JS is trying to get the amount of files selected from the $("#image")[0] input using .files.length. I have alerted this value and it is counting the correct # of files I select.

It is then using a for-loop, using the above count as an index, to perform form.append( "finalform" , $("#image")[0].files[i] )

However, when I send it to PHP and var_dump[$_FILES], which is alerted back in JS, it only shows the last image selected. For example, if I select 10 images, the files.length count is 10. But when the var_dump is alerted, it only shows the last file selected, which is file 10.png.

Any idea why my formdata does not seem to be sending over the other 9 images?

yosimba2000
  • 91
  • 7

1 Answers1

0

For php to be able to read your $_FILES field as an array, you need to append "[]" at the end of its name:

form.append( "finalform[]" , $("#image")[0].files[i]  );

php docs

Kaiido
  • 123,334
  • 13
  • 219
  • 285