Siempre recordemos que no se puede subir archivos usando AJAX, porque el objeto ajax no soporta el enctype requerido para subir archivos asi que se usa un iframe para emular el proceso. Voy a explicar como hacer esto con jquery y ajax
El formulario para subir archivos
1 2 3 4 5 6 7 8 9 | <form action="upload.php" id="frm_uploader" name="frm_uploader" method="post" enctype="multipart/form-data"> <ol> <li><label>Name:</label><input type="text" id="cfname" name="fname" size="30" class="required" /></li> <li><label>E-mail:</label><input type="text" id="cfemail" name="femail" size="30" class="required email" /></li> <li><label>Select Files</label><input name="ffoto[]" type="file" class="multi" accept="gif|jpg|jpeg|png|pdf|zip|rar|ai|eps|mp3|avi|wmv|mpg|mpeg|cdr" /></li> <li><p align="center"><input type="submit" name="submit" value="Upload Now" class="btn" /></p></li> </ol> </fieldset> </form> |
AJAX Jquery
Incluimos las librerias javascript, el script automaticamente buscará el campo con la clase multi
1 2 | <script language="javascript" src="js/jquery-1.31.js"></script> <script language="javascript" src="js/jquery.MultiFile.pack.js"></script> |
PHP para recibir los archivos
Este script permite subir multiples archivos como un array, asi que empezemos por ahi
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <?php $cuales=""; /// Vemos cuantos archivos hemos subido $nro=count($_FILES["ffoto"]["name"]); /// Empezamos el array for ($i=1; $i<$nro; $i++) { $file_name=$_FILES["ffoto"]["name"][$i]; $file_size=$_FILES["ffoto"]["size"][$i]; $file_type=$_FILES["ffoto"]["type"][$i]; if($file_name!=""){ // verifica carpeta $nombre_archivo=$_POST['femail']; if (!file_exists('userfiles'.$nombre_archivo)) { mkdir('userfiles/'.$nombre_archivo,0777); } $path="userfiles/".$nombre_archivo; // sube archivo copy($_FILES["ffoto"]['tmp_name'][$i], $path.'/'.$file_name) ; echo '<p align="center">Your file <b>'.$file_name.'</b> was successfully uploaded</p>'; $cuales.=$file_name." "; } else { echo '<br><br><p align="center"><b>Error with '.$file_name.'</b></p>'; } |
Puedes decargar este plugin jquery y ver mas ejemplos desde la pagina de su creador
Hola, he intentado mas de 10 veces dejarte un comentario, pero los “capchas” que aparecen son totalmente imposibles de identificar, son “demasiado seguros” jaja, inténtalo a ver si soy yo que estoy ya mal de la vista. Lo que quería era agradecerte el post de la subida múltiple de ficheros con el plugin de jQuery, me viene de perlas. Muchas gracias.
Si, tienes razon ya estaba muy complicado ese captcha, ahora esta mucho mas legible