Subir multiples archivos con php

Por: EmiR + 14.12.2006

Código :

 <form name="formu" id="formu" action="upload.php" method="post" enctype="multipart/form-data">
     <dl>            
   <dt><label>Archivos a Subir:</label></dt>
        <!-- Esta div contendrá todos los campos file que creemos -->
   <dd><div id="adjuntos">
        <!-- Hay que prestar atención a esto, el nombre de este campo debe siempre terminar en []
        como un vector, y ademas debe coincidir con el nombre que se da a los campos nuevos 
        en el script -->
   <input type="file" name="archivos[]" /><br />
   </div></dd>
   <dt><a href="#" onClick="addCampo()">Subir otro archivo</a></dt>      
   <dd><input type="submit" value="Enviar" id="envia" name="envia" /></dd>
     </dl>
</form>

Código :

<script type="text/javascript">
var numero = 0; //Esta es una variable de control para mantener nombres
            //diferentes de cada campo creado dinamicamente.
evento = function (evt) { //esta funcion nos devuelve el tipo de evento disparado
   return (!evt) ? event : evt;
}

//Aqui se hace lamagia... jejeje, esta funcion crea dinamicamente los nuevos campos file
addCampo = function () { 
//Creamos un nuevo div para que contenga el nuevo campo
   nDiv = document.createElement('div');
//con esto se establece la clase de la div
   nDiv.className = 'archivo';
//este es el id de la div, aqui la utilidad de la variable numero
//nos permite darle un id unico
   nDiv.id = 'file' + (++numero);
//creamos el input para el formulario:
   nCampo = document.createElement('input');
//le damos un nombre, es importante que lo nombren como vector, pues todos los campos
//compartiran el nombre en un arreglo, asi es mas facil procesar posteriormente con php
   nCampo.name = 'archivos[]';
//Establecemos el tipo de campo
   nCampo.type = 'file';
//Ahora creamos un link para poder eliminar un campo que ya no deseemos
   a = document.createElement('a');
//El link debe tener el mismo nombre de la div padre, para efectos de localizarla y eliminarla
   a.name = nDiv.id;
//Este link no debe ir a ningun lado
   a.href = '#';
//Establecemos que dispare esta funcion en click
   a.onclick = elimCamp;
//Con esto ponemos el texto del link
   a.innerHTML = 'Eliminar';
//Bien es el momento de integrar lo que hemos creado al documento,
//primero usamos la función appendChild para adicionar el campo file nuevo
   nDiv.appendChild(nCampo);
//Adicionamos el Link
   nDiv.appendChild(a);
//Ahora si recuerdan, en el html hay una div cuyo id es 'adjuntos', bien
//con esta función obtenemos una referencia a ella para usar de nuevo appendChild
//y adicionar la div que hemos creado, la cual contiene el campo file con su link de eliminación:
   container = document.getElementById('adjuntos');
   container.appendChild(nDiv);
}
//con esta función eliminamos el campo cuyo link de eliminación sea presionado
elimCamp = function (evt){
   evt = evento(evt);
   nCampo = rObj(evt);
   div = document.getElementById(nCampo.name);
   div.parentNode.removeChild(div);
}
//con esta función recuperamos una instancia del objeto que disparo el evento
rObj = function (evt) { 
   return evt.srcElement ?  evt.srcElement : evt.target;
}
</script>

Código :

<?php 
   //Preguntamos si nuetro arreglo 'archivos' fue definido
         if (isset ($_FILES["archivos"])) {
         //de se asi, para procesar los archivos subidos al servidor solo debemos recorrerlo
         //obtenemos la cantidad de elementos que tiene el arreglo archivos
         $tot = count($_FILES["archivos"]["name"]);
         //este for recorre el arreglo
         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["archivos"]["tmp_name"][$i];
            $name = $_FILES["archivos"]["name"][$i];
            echo("<b>Archivo </b> $key ");
            echo("<br />");
            echo("<b>el nombre original:</b> ");
            echo($name);
            echo("<br />");
            echo("<b>el nombre temporal:</b> \n");
            echo($tmp_name);
            echo("<br />");            
            }
      }      
?>

php

???

pero como armom todo esto??
me sirve mucho...

pero no se que archivos crear..

Por: ego_blog

Muy bueno, util e interesante además adaptable a bastantes usos gracias.
Por: Yranac

//con esta función eliminamos el campo cuyo link de eliminación sea presionado
elimCamp = function (evt){
   evt = evento(evt);
   nCampo = rObj(evt);
   div = document.getElementById(nCampo.name);
   div.parentNode.removeChild(div);
}
//con esta función recuperamos una instancia del objeto que disparo el evento
rObj = function (evt) { 
   return evt.srcElement ?  evt.srcElement : evt.target;
}

//con el indice $i, podemos obtener la propiedad que deseemos de cada archivo
//para trabajar con este

FLORECITA, debes registrarte y exponer tus dudas en los foros para poder obtener respuesta
Por: La100rra

Adonde se van los archivos k envia uno, digo por k en el codigo no veo un aparte donde puedas modificar la ruta de llegada como: micorreo@correo.com o algo asi
Por: Gilberto Quevedo Casillas

Hola, muy bueno el tip. Pero tengo un problema mayor, en una página necesito proveer de algún medio para subir periodicamente algo asi como 400 archivos. Descartando que se utilice un cliente ftp. He visto por ahi un java applet que muestra un explorador de windows con la info del cliente (escritorio, mi pc, etc.) y que permite seleccionar con un checkbook lo archivos a subir. De todas maneras lo expondre en el foro.
Gracias igual por el tema, lo utilizaré en otra web
Por: Pablo_blog

como adaptarlo para otro tipo de campo?
me explico campos de texto y dropdown lists

gracias, el script es muy bueno
Por: mariobj_blog

            $newfile = "subidos/".$name;
            if (is_uploaded_file($tmp_name)) {
               if (!copy($tmp_name,"$newfile")) {
                  print "Error en transferencia de archivo.";
                  exit();
               } // if copy
            } // if is_up...

            $ext = strtolower(strrchr($name,"."));
            echo "extensión: ".$ext."<br>";

Hola, muchas gracias por el código, me resultó muy útil. Pero ahora quisiera saber cómo puedo hacer para modificarlo para que en vez de subir imagenes sean cuadros de texto y que cada dato ingresado se guarde en un arreglo al presionar la tecla ENVIAR.
En sintesis, necesito realizar algo muy similar pero con cuadros de textos y guardar sus valores en un arreglo que mostraré.

Muchas gracias y disculpen las molestias
Por: Rast_blog