problema para subir multiples imagenes

hola a todos. encontre un script de un formulario para mostrar que imagenes estaba por subir. la informacion la encontre aqui.

como las imagenes que estoy a punto de subir, se muestran en un div creando los elementos y no en el formulario del input file. intente con mi codigo y no me captura los nombres de las imagenes.

Código PHP :

//este for recorre el arreglo
$tot = count($_FILES["file_1"]["name"]);
 
for ($i = 0; $i < $tot; $i++)
{
    //con el indice $i, poemos obtener la propiedad que desemos de cada archivo para trabajar con este.
    $tmp_name = $_FILES["file_".$i]["tmp_name"];
    $name = $_FILES["file_".$i]["name"];
    
    echo "<b>El nombre original:</b> ";
    echo $name;
    
}

haciendo un echo a la variable $tot me imprime solo la imagen que se subio primero. mi pregunta es como haria para capturar los nombres de las imagenes que me estan generando ?.

El codigo html que genera las imagenes.

Código HTML :

<form enctype="multipart/form-data" action="procesar.php" method = "post">
   <!--The file element. NOTE: it has an ID-->
   <input id="file_1" type="file" name="file_1" />
   <input type="submit" value="Enviar" />
</form>
Files:
<!-- This is where the output will appear -->
<div id="files_list"></div>
<script>
   <!-- Create an instance of the multiSelector class, pass it the output target and the max number of files -->
   var multi_selector = new MultiSelector( document.getElementById('files_list'), null);
   <!-- Pass in the file element -->
   multi_selector.addElement( document.getElementById('file_1'));
</script>

usas arrays en el HTML

Código :

<form enctype="multipart/form-data" action="procesar.php" method = "post">
   <!--The file element. NOTE: it has an ID-->
   <input id="file_1" type="file" name="file[]" />
<input id="file_2" type="file" name="file[]" />
<input id="file_3" type="file" name="file[]" />
   <input type="submit" value="Enviar" />
</form>

y mira que te devuelve en el php

Código PHP :

<?php
//este for recorre el arreglo
//$tot = count($_FILES["file_1"]["name"]);
//vemos el contenido de 'file' deberia ser un array con los 3 campos de archivo
var_dump($_FILES["file"]);
/* 
for ($i = 0; $i < $tot; $i++)
{
    //con el indice $i, poemos obtener la propiedad que desemos de cada archivo para trabajar con este.
    $tmp_name = $_FILES["file_".$i]["tmp_name"];
    $name = $_FILES["file_".$i]["name"];
    
    echo "<b>El nombre original:</b> ";
    echo $name;
    
}*/

Además en $tot se está guardando la cuenta de un solo elemento del array $_FILES. Y es que no necesitas hacer eso tampoco. Basta con que recorras el array con foreach.

gracias por responder tuadmin. al hacer var_dump($_FILES['files_1']) me imprime solo una imagen. el resto de las imagenes no los muestra. como le dije antes, este codigo html:

Código HTML :

Files:
<!-- This is where the output will appear -->
<div id="files_list"></div>
<script>
   <!-- Create an instance of the multiSelector class, pass it the output target and the max number of files -->
   var multi_selector = new MultiSelector( document.getElementById('files_list'), null);
   <!-- Pass in the file element -->
   multi_selector.addElement( document.getElementById('file_1'));
</script>

es el que me genera las imagenes y no estan dentro del input file. me dijo que utilize foreach, pero mi duda es como hago para k me capture los nombres de las imagenes que me estan generando ?.

Código :

<div id="files_list">
<div>[b]11DF8F_1.jpg[/b]<input type="button" value="Borrar"></div>
<div>[b]comer en familia.jpg[/b]<input type="button" value="Borrar"></div>
<div>[b]Familia Campo.jpg[/b]<input type="button" value="Borrar"></div>
<div>[b]Familia Palin.jpg[/b]<input type="button" value="Borrar"></div>
</div>