Adding multiple input type file boxes and reading them

[mikelmao]

Hello,

 

Iv written a small script in JS to add input boxes of the type file to the page.. My problem is when i use multiple of those input boxes and submit the form the $_FILES variable only reads 1 of those boxes.. This is the javascript im using:

function addImageBox() {
var imageBoxes = document.getElementById("imageBoxes");
var tr = document.createElement("tr");
var td = document.createElement("td");
var td2 = document.createElement("td");
    var inputFile = document.createElement("input");
    
    
    inputFile.setAttribute("type", "file");
    inputFile.setAttribute("name", "image[]");
    inputFile.setAttribute("style", "width: 450px");

    td.appendChild(document.createTextNode("Image"));
    td2.appendChild(inputFile);
    
    tr.appendChild(td);
    tr.appendChild(td2);
    
    imageBoxes.appendChild(tr);
}

 

When i add 2 boxes (making it 3 boxes on the page in total) and count the $_FILES var after submiting the form, the count method returns 1, and when i var_dump it only 1 array is in $_FILES. Any idea's? thanks!

[spiderwell]

element by Id is unique so it will only pick up 1?

 

perhaps change id to name? then use name which is an array like imageBoxes[]

 

 

this isnt a solution, more me chucking out ideas and thoughts   javascript is the enemy in my mind, lol

[mikelmao]

element by Id is unique so it will only pick up 1?

 

perhaps change id to name? then use name which is an array like imageBoxes[]

 

 

this isnt a solution, more me chucking out ideas and thoughts   javascript is the enemy in my mind, lol

it isnt a javascript problem (i think). The boxes get added correctly to the page but when i submit my forum and with PHP var_dump the $_FILES var it returns only 1 array while it suppose to return multiple arrays because i added more then 1 box...

[PFMaBiSmAd]

It would help if you posted the form you are using.

[mikelmao]

this is the form im using:

 

echo '<table>';
echo '<form method="post" enctype="multipart/form-data">';
echo '<tr><td>Title:</td><td><input type="text" name="title" style="width: 450px;"></td></tr>';
echo '</table>';
echo '<table id="imageBoxes">';
echo '<tr><td>Image:</td><td><input type="file" name="image[]" style="width: 450px;"></td></tr>';
echo '</table>';
echo '<table>';
echo '<tr><td colspan=2><a href="javascript:addImageBox()">Add Image Box</a></td></tr>';
echo '<tr><td>Link:</td><td><input type="text" name="link" style="width: 450px;"></td></tr>';
echo '<tr><td>Description:</td><td><textarea name="article" style="width: 450px; height: 200px;"></textarea></td></tr>';
echo '<tr><td colspan=2><input type="submit" value="Submit"></td></tr>';
echo '</form>';
echo '</table>';

 

And the javascript code add's new boxes to the 'imageBoxes' div...

[dcro2]

I just tried this and $_FILES does contain both uploads, but probably not in the way you were expecting. Here's a print_r of $_FILES

Array
(
    [image] => Array
        (
            [name] => Array
                (
                    [0] => hosts.txt
                    [1] => phptest.php
                )

            [type] => Array
                (
                    [0] => text/plain
                    [1] => text/php
                )

            [tmp_name] => Array
                (
                    [0] => /private/var/tmp/phpxuFkeP
                    [1] => /private/var/tmp/phpcn3sF5
                )

            [error] => Array
                (
                    [0] => 0
                    [1] => 0
                )

            [size] => Array
                (
                    [0] => 24198
                    [1] => 251
                )

        )

)

Instead of $_FILES['image'] having two members like you would expect, each part of it is an array with two members.

[PFMaBiSmAd]

I also tested your javascript with my own form and it works as expected.

 

If your var_dump/print_r doesn't show information like what dcro2 posted, either your php code is overwriting/clearing the entries or the actual form you were using at the time isn't what you think it was. Did you refresh your browser after making any changes to the html/javascript of your form so that they would get incorporated into the form in the browser?