Autor
|
Tema: Subir multiples archivos de una vez. (Leído 8,447 veces)
|
newinl
Desconectado
Mensajes: 96
|
Saludos. Vengo a aportar y a pedir un poco de ayuda a los que saben ojalá y puedan echarme la mano. Me he visto en la necesidad de incorporar en una pagina un formulario para subir multiples archivos de imagenes. La peculiaridad es que los campos de archivo aumentan segun lo requieras (haciendo clik en Agregar otro Archivo sin tener que recargar la pagina o subir uno por uno de los archivos. Ahora eh logrado hacer que suban los ficheros pero me gustaría mucho que me ayudaran. Les pongo el codigo del html que contiene el formulario. <HTML> <HEAD> <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; } // 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> </HEAD>
<BODY> <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()">Agregar otro archivo</a></dt> <dd><input type="submit" value="Enviar" id="envia" name="envia" /></dd> </dl></form> </BODY> </HTML> se ve asi: Ahora el archivo upload.php que valga la redudancia es el que se encarga de gestion de la subidas y con el que quiero que me echen la mano: <?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]; $newfile = "imagenes/".$name; if (is_uploaded_file($tmp_name)) { if (!copy($tmp_name,"$newfile")) { print "Error en transferencia de archivo."; exit(); } // if copy } // if is_up... 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 />"); } } ?> HASTA aqui los codigos funcionan como deben. La cosa es que no he podido encontrar la forma de que los archivos que se suben no se sobreescriban si tienen el mismo nombre, tampoco hacer que sólo se permita cierto tipo de extensiones (particularmente imagenes). Intente agregar esto para eso, pero el upload deja de funcionar. $partes = explode('.',$_FILES['archivo']['name']) ; $num = count($partes) - 1 ; $extension = $partes[$num] ; if($_FILES['archivo']['size'] <= 524288 && !file_exists('imagenes/'.$_FILES['archivo']['name']) && $extension == 'jpg' || $extension == 'JPG') {code], esto lo puse enseguida de [code]if (isset ($_FILES["archivos"])) { Pero como dije no funciona. NO sé Casi mucho o casi nada de php pero ojala y no sea un impedimento para que me ayuden. 1.- Lo que le falta al archivo "upload.php es que no sobreescriba los ficheros, lo mejor es que se aborte la subida. El nombre de los archivos no deben cambiar. Deben mantener su nombre origiinal.2.- Restringir la subida de archivos a un par de tipos, jpg, gif. y 3.- Limitar el peso de los ficherosOajalá y a alguien le sirva estos codigos y también a los que saben me puedan ayudar con esos probemillas que tengo. [/code]
|
|
« Última modificación: 30 Diciembre 2007, 02:49 am por newinl »
|
En línea
|
|
|
|
USUARIO_DE_SOFTWARE_LIBRE
|
Hola, para ver si al archivo que se subió existe: if(file_Exists("imagenes/".$HTTP_POST_FILES['archivo']['name'])){ echo "Ya se subió un archivo con este nombre, voy a ponerle otro nombre :)"; copy($tmp_name,"$newfile"."(1))
} else{ echo 'El archivo NO existe, éxito!!'; } Con eso te va a copiar el archivo pero al fina le va a agregar la cadena "(1)"
|
|
|
En línea
|
|
|
|
newinl
Desconectado
Mensajes: 96
|
Saludos y gracias por responder marcolandia^^. Pero eso que dices no sé para que lo debería de poner debido a que esta por demás ya que: $tmp_name = $_FILES["archivos"]["tmp_name"][$i]; $name = $_FILES["archivos"]["name"][$i]; $newfile = "imagenes/".$name; Harían ese trabajo no? Además de que la cosa es que sé que si sube los archivos pero eso no es mi problema CREO que ya lo describi al incio no?,
AYUDAAAAAAAA
Si no les gusta el archivo upload.php como lo tengo pues no importa que lo cambien todo con tal de que estas caracteristicas se cumplann: 1..- Sólo acepte *.jpg, gif, png. 2.- Limitar el tamaño de fichero a 500 kb 3.- NO Se admita subir ficheros con nombre repetido, para evitar sobreescribir.
Por favor sé que por ahi habrá un webmaster de buen corazon que Sepa de verdad algo de esto y que me quiera echar la mano. Gracias
|
|
« Última modificación: 2 Enero 2008, 20:26 pm por newinl »
|
En línea
|
|
|
|
newinl
Desconectado
Mensajes: 96
|
Y yo que pense que había por aqui alguno que me pudiera ayudar. Bueno espero que con esto si me puedan ayudar. Como no encontré la forma de solucionar esos pequeños problemas pues mejor recurro con una duda casi del mismo tipo pero de difernete escrip. El programa hace lo mismo, subir multiples ficheros pero con la diferencia de que usa un sistema para agregar campos "file" automaticamente segun se requiera. Pongo los archivos Index.html y up.php que tengo tal cual. y abajo explico mi problema. <html>
<head> <!-- Aqui se incluye la referencia al java-script --> <script src="multifile_compressed.js"></script> </head>
<body>
<!-- Este es el formulario --> <form enctype="multipart/form-data" action="up.php" method = "post"> <!-- NOTA: el "file element es un ID --> <input id="my_file_element" type="file" name="file_1"> <input type="submit" value="Enviar"> </form> Archivos a enviar: <!-- Aqui aparecerá la lista de archivos seleccionados --> <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' ), 5 ); <!-- Pass in the file element --> multi_selector.addElement( document.getElementById( 'my_file_element' ) ); </script> </body> </html> Notese la parte de name="file_1". Ahora pongo el archivo up.php que hace referencia el formulario: <?php /* if the max file size in the form is more than what is set in php.ini then an addition needs to be made to the htaccess file to accomodate this add this to your .htaccess file for this directory php_value post_max_size 10M php_value upload_max_filesize 10M replace 10M to match the value you entered above for $max_file_size */ // images dir - relative from document root // this needs to be a folder that is writeable by the server $image_dir = '/upload/files/';
// La estructura de mis direcorios es asi: G:\AppServ\www\load\uploads\files //Donde el archivo Index.html y up.php se localizan dentro de la carpeta "load" // upload dir $destination = $_SERVER['DOCUMENT_ROOT'].$image_dir; if(isset($_FILES)) { // initialize error var for processing $error = array(); // acceptable files // if array is blank then all file types will be accepted $filetypes = array( 'bmp' => 'image/x-ms-bmp', 'jpg' => 'image/jpeg', 'jpe' => 'image/jpeg', 'jpeg' => 'image/jpeg', 'png' => 'image/x-png', 'swf' => 'application/x-shockwave-flash', 'tif' => 'image/tiff', 'tiff' => 'image/tiff', ); // function to check for accpetable file type function okFileType($type) { // if filetypes array is empty then let everything through if(count($GLOBALS['filetypes']) < 1) { return true; } // if no match is made to a valid file types array then kick it back elseif(!in_array($type,$GLOBALS['filetypes'])) { $GLOBALS['error'][] = $type.' is not an acceptable file type. '. $type.' has been ignored.'; return false; } // else - let the file through else { return true; } } // function to check and move file function processFile($file) { // set full path/name of file to be moved //COMENTARIO MIO: en este linea es donde empece a cambiar todos los $file['name'] por $file['file_1'] Igual que como esta en el campo del formulario " <input id="my_file_element" type="file" name="file_1">
$upload_file = $GLOBALS['destination'].$file['file_1']; if(file_exists($upload_file)) { $GLOBALS['error'][] = $file['file_1'].' - Filename exists - please change your image filename'; return false; } if(!move_uploaded_file($file['tmp_name'], $upload_file)) { // failed to move file $GLOBALS['error'][] = 'File Upload Failed on '.$file['file_1'].' - Please try again'; return false; } else { // upload OK - change file permissions chmod($upload_file, 0755); return true; } } // check to make sure files were uploaded $no_files = 0; $uploaded = array(); foreach($_FILES as $file) { switch($file['error']) { case 0: // file found if($file['file_1'] != NULL && okFileType($file['type']) != false) { // process the file if(processFile($file) == true) $uploaded = $file['file_1']; } break; case (1|2): // upload too large $error[] = 'file upload is too large for '.$file['file_1']; break; case 4: // no file uploaded break; case (6|7): // no temp folder or failed write - server config errors $error[] = 'internal error - flog the webmaster on '.$file['file_1']; break; } } } ?> Notese mis comentarios dentro del archivo. $image_dir = '/upload/files/' es la misma estructura que tengo, además de que ya hasta cambie los slashes a invertidos, dobles, dobles invertidos, ruta completa y no funciona. Se supone que estos dos archivo se complementan muy bien pero yo no los he podido hacer andar. La parte del formulario funciona bien, (me ahorro poner el apartado .js pues ese no se encarga de la subida de ficheros) Al momento de presionad enviar, parece que el archivo se envia pero no, la pagina up.php se queda en blanco sin mostrar ni los errores ni nada. Sé que me falta mucho por saber, pero tambien sé que al archivo up.php no debería de dar problemas. OJALÁ y ahora si me puedan ayudar, y asi nos ayudamos a muchos mas pues este script esta muy bueno. El script original es muy conocido supuestamente aunque no conozco a nadie hasta ahora que me comparta la forma de echarlo a andar.
|
|
|
En línea
|
|
|
|
newinl
Desconectado
Mensajes: 96
|
Gente, les vengo a comentar que he solcuinado lo del segundo script, ya funciona con subudas multiples, limtando el tamaño de archivo, pemitiendo solo los tipos de archivos que quiero que se suban. La respuesta me la ayudaron a construir en otro foro, sin embargo siento nostalgia y pena porque de tantas veces que he pedido ayuda en este foro pocas veces las he recibido, casi que estoy seguro que si hay gente muy diestra en estas artes de la programación, pero como que la participación no es nada amigable e incluso me han llegado a eliminar mis post sin saber yo porque. Ojalá y no me vean esta crítica como generalista, porque tambien admito que hay gente que aporta sus conocimientos sin hacer mucho ruido. Aun sigo viendo este foro como parte de la costrucción de buenos conocimientos a pesar de lo estrecho de algunas mentes que andan por ahi y sólo ciritican sin construir. Gracias a los que han ayudado a otros y aportan. Yo seguiré por aqui, espero no me corran. Les pongo de una buena vez los codigos de los archivo faltante y la correccion del up.php para la subida de multiples Archivos: El index.html es el mismo el up.php quedaría asi: <?php /* if the max file size in the form is more than what is set in php.ini then an addition needs to be made to the htaccess file to accomodate this add this to your .htaccess file for this directory php_value post_max_size 10M php_value upload_max_filesize 10M replace 10M to match the value you entered above for $max_file_size */ // images dir - relative from document root // this needs to be a folder that is writeable by the server $image_dir = '/load/uploads/files/';
// NEWINL dice: La estructura de mis direcorios es asi: G:\AppServ\www\load\uploads\files //Donde el archivo Index.html y up.php se localizan dentro de la carpeta "load" //Los tres archivos deben de estar en la primer carpeta que apunta $image_dir osea en load. aparte de que debe tener esa estrcutura de segui carpta upload y al final otra carpeta con el nobre files que es ahi donde se copiaran los archivos.
// upload dir $destination = $_SERVER['DOCUMENT_ROOT'].$image_dir; if(isset($_FILES)) { // initialize error var for processing $error = array(); // acceptable files // if array is blank then all file types will be accepted $filetypes = array("image/eps","image/tiff","image/tif","image/pjpeg","image/pjpg","image/gif","image/bmp", 'jpg' => 'image/jpeg', 'jpe' => 'image/jpeg', 'jpeg' => 'image/jpeg', 'bmp' => 'image/x-ms-bmp'); //newinl: De esta forma funcionaran adecuadamente en IE y FF // function to check for accpetable file type function okFileType($type) { // if filetypes array is empty then let everything through if(count($GLOBALS['filetypes']) < 1) { return true; } // if no match is made to a valid file types array then kick it back elseif(!in_array($type,$GLOBALS['filetypes'])) { $GLOBALS['error'][] = $type.' No es un archivo aceptable. '. $type.' ha sido ignorado.'; return false; } // else - let the file through else { return true; } } // function to check and move file function processFile($file) { // set full path/name of file to be moved //COMENTARIO newinl: en este linea es donde empece a cambiar todos los $file['name'] por $file['file_1'] Igual que como esta en el campo del formulario " <input id="my_file_element" type="file" name="file_1"> $upload_file = $GLOBALS['destination'].$file['file_1']; if(file_exists($upload_file)) { $GLOBALS['error'][] = $file['file_1'].' - Este nombre de archivo ya existe - por favor cambia el nombre e intenta otra vez'; return false; } if(!move_uploaded_file($file['tmp_name'], $upload_file)) { // failed to move file $GLOBALS['error'][] = 'Subida de archivo fallo! '.$file['file_1'].' - Por favor intenta otra vez'; return false; } else { // upload OK - change file permissions chmod($upload_file, 0755); return true; } } // check to make sure files were uploaded $no_files = 0; $uploaded = array(); foreach($_FILES as $file) { $file['file_1']=$file['name'];//<--esto es lo agregado switch($file['error']) { case 0: // file found if($file['file_1'] != NULL && okFileType($file['type']) != false) { // process the file if(processFile($file) == true) $uploaded = $file['file_1']; } break; case (1|2): // upload too large $error[] = 'Tamaño de archivo es demasiado largo '.$file['file_1']; break; case 4: // no file uploaded break; case (6|7): // no temp folder or failed write - server config errors $error[] = 'Erro interno - avisa al administrador '.$file['file_1']; break; } } } {print_r( $GLOBALS['error']);} echo "<a href='index.html'>Subir mas archivos</a></p> ?>
Y por último tenemos el archivo JS en el cual tambien estan los creditos de quien originalmente creo el archivo y del cual se reconoce. Ah si el archivo debe llevar el nombre que aparece en el Index.html osea; "multifile_compressed.js" // Multiple file selector by Stickman -- http://www.the-stickman.com // with thanks to: [for Safari fixes] Luis Torrefranca -- http://www.law.pitt.edu and Shawn Parker & John Pennypacker -- http://www.fuzzycoconut.com [for duplicate name bug] 'neal' function MultiSelector( list_target, max ){this.list_target = list_target;this.count = 0;this.id = 0;if( max ){this.max = max;} else {this.max = -1;};this.addElement = function( element ){if( element.tagName == 'INPUT' && element.type == 'file' ){element.name = 'file_' + this.id++;element.multi_selector = this;element.onchange = function(){var new_element = document.createElement( 'input' );new_element.type = 'file';this.parentNode.insertBefore( new_element, this );this.multi_selector.addElement( new_element );this.multi_selector.addListRow( this );this.style.position = 'absolute';this.style.left = '-1000px';};if( this.max != -1 && this.count >= this.max ){element.disabled = true;};this.count++;this.current_element = element;} else {alert( 'Error: not a file input element' );};};this.addListRow = function( element ){var new_row = document.createElement( 'div' );var new_row_button = document.createElement( 'input' );new_row_button.type = 'button';new_row_button.value = 'Quitar';new_row.element = element;new_row_button.onclick= function(){this.parentNode.element.parentNode.removeChild( this.parentNode.element );this.parentNode.parentNode.removeChild( this.parentNode );this.parentNode.element.multi_selector.count--;this.parentNode.element.multi_selector.current_element.disabled = false;return false;};new_row.innerHTML = element.value;new_row.appendChild( new_row_button );this.list_target.appendChild( new_row );};};
Espero que les sriva mucho ya que a mi gusto es justo lo que buscaba.
|
|
« Última modificación: 7 Enero 2008, 21:36 pm por newinl »
|
En línea
|
|
|
|
|
Mensajes similares |
|
Asunto |
Iniciado por |
Respuestas |
Vistas |
Último mensaje |
|
|
multiples archivos con fstream (AYUDA)
Programación C/C++
|
bash
|
0
|
1,639
|
3 Julio 2012, 20:44 pm
por bash
|
|
|
escritura de multiples archivos en python
Scripting
|
eolh652
|
3
|
2,640
|
4 Octubre 2013, 14:06 pm
por Softrix18
|
|
|
subir multiples archivos
PHP
|
bengy
|
1
|
1,435
|
17 Octubre 2013, 17:49 pm
por miloscorp
|
|
|
Multiples archivos con XSLT & Saxon en Java
Java
|
Lind L. Tailor
|
1
|
1,954
|
24 Marzo 2015, 17:41 pm
por Lind L. Tailor
|
|
|
Modificar valores Hex en múltiples archivos
Ingeniería Inversa
|
Misomeister
|
2
|
3,765
|
29 Mayo 2017, 18:52 pm
por animanegra
|
|