Desarrollo web. Redes sociales, Herramientas Web y más

Uploadify: upload multiple con jQuery

9/03/2009 |    |  share  |   12 Comentarios

Uploadify es un plugin para jQuery el cual utiliza flash para realizar la selección multiple de archivos.

Su implementación es muy sencilla y aquí. explico como se realiza:

Primero descargamos el plugin jquery.uploadify-v1.6.2.zip”>aquí.

Despues de haberlo descomprimido en una carpeta del servidor local pasaremos a crear un archivo upload.html en el cual agregaremos las librerías javascript y css necesarias dentro del head.

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery.uploadify.js"></script>
<link type="text/css" rel="stylesheet" href="uploadify.css"  />

Este script nos sirve para establecer las características del boton “Upload”, si es automatico, si puede subir varios archivos, etc. Lo colocaremos dentro del head y despues de haber agreado las librerías

$(document).ready(function() {
	$("#fileUpload").fileUpload({
			'uploader': 'uploader.swf',
			'cancelImg': 'cancel.png',
			'folder': 'uploads/',
			'buttonText': 'Seleccionar',
			'checkScript': 'check.php',
			'script': 'upload.php',
			'multi': true,
			'simUploadLimit': 2
		});

});

Dentro del body pondremos un input tipo “file” y un link a funciones javascript para comenzar y limpiar la descarga

<input name="fileUpload" id="fileUpload" type="file" />
<a href="javascript:$('#fileUpload').fileUploadStart()">Subir</a> | <a href="javascript:$('#fileUpload').fileUploadClearQueue()">Limpiar</a>

El ultimo paso seria verificar si la carpeta donde subirán los archivos tiene permisos de escritura y listo, pueden ver el ejemplo aquí.

Recursos

Comparte este Post

Tags

, ,

Post Relacionados

Deja tu Comentario

12 Comentarios para este Post

  1. Diseño web madrid Dice:

    Excelente recurso para los diseñadores web con ganas de mejorar nuestras webs. Muy util.

    Gracias

  2. cguerrero Dice:

    Que tal, ya lo implemente en mi web pero, al parecer todo va bien y al cuando veo la carpeta de uploads no hay nada, ya le indique los permisos de escritura. alguna idea. gracias

  3. Jose Luis Dice:

    YO tambien tengo el mismo lio, y ya indique rutas y nada, estoy desesperado, el codigo en javascript esta muy enredado.

    Pense que tenia problemas porque la funcion move_uploaded_file, necesita la ruta absoluta, y se la especifique y nada, sigue sin funcionar.

    Funciono bien en mi maquina de forma local, pero en el servidor no le funciona el upload.

  4. admin Dice:

    Hola cguerrero y Jose Luis:

    Uno de estos problemas suele suceder porque es script que nos muestra el plugin esta en subniveles de carpetas o tal vez por que lo incrustamos de archivos con include o require.
    Lo que tienen que hacer es probar con el firebug la respuesta que te da el script PHP para subir el archivo, traten imprimiendo con print_r($_FILES);exit(); y tambien el path absoluto donde lo estan subiendo , de esta manera pobran saber si el file esta tratando de subir a la carpeta indicada.

    Saludos.

  5. aker Dice:

    Hey porque no se pueden ver los articulos?

  6. anibalag85 Dice:

    Hola a todos, yo tengo el mismo problema, lo subo a mi web y empieza ha subir archivos, pero cuando pone completed y parece que ya ha terminado miro el directorio uploads y no hay nada de nada.
    El directório tiene todos los permisos y he probado con diferentes rutas a ver que pasa pero no hace nada.
    Me podrían hechar una mano por favor, llevo tiempo con esto y no se que hacer.
    Gracias de antemano

  7. osirus Dice:

    Como ago para guardar el nombre en Mysql

  8. atx Dice:

    Como dijo osirus seria optimo poder lograr guardar los nombres de las imagenes o archivos en MYSQL estuve haciendo testeos pero aun ningun exito, si alguien tiene una idea sera bienvenida
    excelente post.
    Saludos A todos

  9. Jaime Jesus Delgado Meraz Dice:

    Hey porque no se puedo ver el tutorial? tengo que estar registrado o algo por el estilo?

  10. craftyman Dice:

    No para nada, todos los articulos se ven sin necesidad de registro alguno.

    Saludos.

  11. SVT Dice:

    Hola a todos, este es un excelente recurso, justo lo que necesito, solo que tengo una duda, cada que subo archivos me manda un mensaje de alert para pedirme una confirmacion que si deseo reemplazar los archivos…. alguna idea de como quitar ese mensaje ?

    saludos.

  12. leandro Dice:

    no anda, tengo todos los permisos habilitados, incluso en la demo que tenes para mostrar no funciona, directamente no carga la barra ( es lo mismo que me pasa a mi ).