[Php-avanzado] Consulta ???

Matias Gea matigea en gmail.com
Lun Nov 11 10:35:45 ART 2013


Hola, Daniel.

La preview de fotos en javascript tenés que hacerla con la FileAPI (y
FileReader interface) de los navegadores (es un working draft, fijate el
soporte: http://caniuse.com/#feat=fileapi). Fijate algunos ejemplos
funcionales y documentacion (todo en ingles):

http://kellishaver.tumblr.com/post/21428272282/using-the-file-api-to-preview-images-before-uploading
http://robertnyman.com/2010/12/16/utilizing-the-html5-file-api-to-choose-upload-preview-and-see-progress-for-multiple-files/
https://developer.mozilla.org/en-US/docs/Web/API/FileReader
http://html5demos.com/file-api
http://www.html5rocks.com/en/tutorials/file/dndfiles/

Basicamente consiste en escuchar el evento 'onchange' del file input, luego
leer los archivos locales del array files del mismo y procesarlos con el
file reader. Éste último va a llamar a una función de callback cuando
termine de leer el archivo del disco, y en esta función es donde se utiliza
readAsDataUrl para poner ese preview como src de un elemento img.

Es mucho más simple si usás algún framework, como jQuery, sino, igualmente
podés hacerlo, pero tenés que escribir más código para soportar los
diversos navegadores (hay problemas especialmente con algunas cosas de IE,
como el agregado de listeners para los eventos).

Cualquier cosa que te falle, pasá el código y lo vemos.

Saludos!


El 11 de noviembre de 2013 09:54, Daniel Billia <ferudine en sion.com>escribió:

> Buenos días Leo te tengo una consulta estoy en la parte de cargar la fotos
> para los articulos y quiero generar un preview en javascript encontré
> mieles de ejemplo pero como siempre ninguno funciona y por lo que vi cuando
> carga el path local de la foto no lo encuentre, le puse a un ejemplo de
> javascript el path de una foto en el servidor anduvo bien me podes orientar
> sobre este tema Saludos ¡!!!
> _______________________________________________
> Lista de correo: Php-avanzado
> Mensajes a la lista: Php-avanzado en pato2.fi.mdp.edu.ar
> Administración Web: http://www3.fi.mdp.edu.ar/cgi-
> bin/mailman/listinfo/php-avanzado
> Desubscripción: php-avanzado-request en pato2.fi.
> mdp.edu.ar?subject=unsubscribe
>



-- 
Matias Fernando Gea
matigea en gmail.com
http://www.mfgea.com.ar
------------ próxima parte ------------
Se ha borrado un adjunto en formato HTML...
URL: <http://www3.fi.mdp.edu.ar/pipermail/php-avanzado/attachments/20131111/dbc858ae/attachment.html>


Más información sobre la lista de distribución Php-avanzado