logo El diario de Pepe Molina (Caricatos)

yo

Hasta hace poco, la forma de subir archivos era a través del envío de un formulario, y se podía "simular" el uso de la tecnología "Ajax" dirigiendo el resultado a un iframe


Última caricatura

IV Asamblea de la AEC: IV Asamblea General de la Asociación Española de Caricaturistas

IV Asamblea de la AEC

RSS de las imágenes: rss


La Cita

El verdadero modo de no saber nada es aprenderlo todo a la vez

George Sand, escritora francesa (1804-1876).


En esta zona están las páginas personales del autor.


Mis clientes ahora también son mis amigos (aunque les cobre).


En Mis amigos Informáticos hay una pequeña colección de páginas de colegas webmasters..


En Mis amigos artistas podemos encontrar artistas de cualquier índole (dibujantes, pintores, escritores...)


Las recomendaciones que proponemos son de índole variada.


Aquí un cajón de sastre de enlaces.


Nos referencian desde sitios de toda índole.


Puede contribuir a mantener esta página con su donativo.


botón pay-pal

Subir archivos con Ajax

emoticón de Caricatos Publicado el día 01 de julio de 2014
id=137; categorías: Vicisitudes de un Webmaster, Globalización, Programación

Hasta hace poco, la forma de subir archivos era a través del envío de un formulario, y se podía "simular" el uso de la tecnología "Ajax" dirigiendo el resultado a un iframe (oculto o no), como hacíamos en este artículo: Revisar las imágenes antes de subirlas.

Con el nivel 2 del objeto XMLHttpRequest y los objetos FormData se puede lograr subir ficheros sin tener que pulsar el botón destinado al envío de un formulario.

Usando el evento de cambio de estado de un control file vamos a subir el fichero que elijamos. Por el asunto de la accesibilidad usaremos un formulario con su botón de envío, pero "maquillado" en etiquetas "noscript":

<form action="recibir.php" method="post" enctype="multipart/form-data" id="formulario">
	<label for="fichero">
		Fichero que se enviará:
	</label>
	<input type="file" name="fichero" id="fichero"/>
	<noscript>
		<button type="submit">
			Enviar Archivo
		</button>
	</noscript>
</form>

La función Ajax para subir el fichero y que asociaremos al evento de cambio del control "fichero" llevará estas líneas:

function tag(id) {return document.getElementById(id);};
function subir_con_Ajax()	{
	fd = new FormData(tag("formulario"));
	Ajax = new XMLHttpRequest();
	Ajax.open("POST", tag("formulario").action, true);
	Ajax.onreadystatechange = function() {
		if	(Ajax.readyState == 4 && Ajax.status == 200) {
			alert(Ajax.responseText);
		}
	}
	Ajax.send(fd);
}

Con este sencillo código en nuestra página y unas pocas líneas de código en el fichero que procese el formulario en el servidor, ya podemos subir nuestros ficheros seleccionados.

Zona de comentarios

Hemos encontrado 1 comentarios.

#Mensaje enviado por Grelux
Comentario escrito el día 08 de febrero de 2016, a la hora 22:58:33
email: greinny@gmail.com

Estupendo me funciono a la perfección el FormData nunca me funcionomi emoticón

Evaluación

Valoración de esta página: (apunte.137) valor

Valoración evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar

Respuesta: Zona de mensajes (proceso de evaluación)

Historial de navegación

Esta página ha sido visitada en 10781 ocasiones


Disponemos de rss sindicar

Y del Mapa del sitio, además del sitemap.xml.


Aquí podemos encontrar los apuntes más visitados.

"Top 10" reemplaza a la sección Últimos apuntes.


Una buena forma de buscar un apunte es a partir de su categoría.


También es posible buscar apuntes por medio de las etiquetas (tags).


Hemos decidido poner al alcance de todos algunos comodines.

Adjuntamos una versión reducida del "buscador interno" que vemos en la lista anterior:

Buscar en apuntes

También estamos recopilando antiguas páginas del sitio.


Desde este recuadro se puede hacer una búsqueda cronológica.


Se puede crear una postal nueva desde el enlace del sector "Otras páginas del dominio", o editar la que sale en el recuadro, pulsando sobre ella..

http://www.pepemolina.com/postales/Fondos/FONDO005.gif
http://www.pepemolina.com/postales/Musicales/Imagen1.gif
http://www.pepemolina.com/postales/Musicales/Imagen2.gif
http://www.pepemolina.com/postales/Musicales/Imagen3.gif
http://www.pepemolina.com/postales/Musicales/Imagen4.gif
http://www.pepemolina.com/postales/Musicales/Imagen5.gif
http://www.pepemolina.com/postales/Musicales/Imagen6.gif
http://www.pepemolina.com/postales/Musicales/Imagen7.gif
Postal Digital
Postal Digital
enlace a la postal
Copyright © 2002-2024 www.pepemolina.com
RSS rss | Ver Mapa del sitio