Bienvenido a datoweb.com!! En este foro podrás encontrar ayuda sobre diseño y desarrollo web en general. Si quieres formar parte de esta comunidad para pedir ayuda o colaborar ayudando a otros usuarios del foro solo tienes que registrarte desde el siguiente enlace: Registrarse en el Foro

Como subir imagen con ajax y php


Ejemplo sencillo de como subir una imagen utilizando ajax y php, se trata de una función que se ejecuta al seleccionar un archivo y lo envía a un fichero php que se encarga de guardar la imagen en el servidor.

index(.php o .html o .x)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
function upload_img(){

	var formData = new FormData($("#formUpload")[0]);
	$.ajax({
	type: 'POST',
	url: 'subida.php',
	data: formData,
	contentType: false,
	processData: false
	});

}
</script>

<form onsubmit="return false" class="oculto" method="post" enctype="multipart/form-data" id="formUpload">
	<input type="file" name="image" onchange="upload_img();">
</form>
subida.php
<?php 
if (isset($_FILES['image'])) {
	move_uploaded_file($_FILES['image']['tmp_name'], $_FILES['image']['name']);
}
?>
Cualquier duda comentar ;)
Editado
4
Puntos
14925
Visitas
7
Resp
Por alber hace 102 meses
Administrador
Respuesta #1
muy buen aporte :)
1
Puntos
Por pablo hace 102 meses
Experto
Respuesta #2
Muchisimas gracias.... Sólo una pregunta. Utilizaré este código para cambiar el background de un div, dejando una ruta fija con un nombre de archivo fijo. Ejemplo: background-image: url("imagenes/fondo.jpg");

Si quiero que un cliente cambie mediante este código la imagen, pero que no necesite hacer nada más... Cómo podría implementar la función de autorenombrado para que suba la que suba se guarde como fondo.jpg????

ME está matando este tema y necesitaría ayuda. Gracias.-
0
Puntos
Por Papiro hace 91 meses
Principiante
Respuesta #3
y si quiero que suba sierta cantidad de fotos , por ejemplo solo 4 como hago?
1
Puntos
Por fernandoury hace 90 meses
Principiante Sitio web
0
Puntos
Por alber hace 90 meses
Administrador
Respuesta #5
para enviar el Form que contiene mas informacion y una imagen hay que por obligacion utilizar este codigo en la funcion para enviar los datos.
var formData = new FormData($("#formUpload")[0]);
o se puede
var formData = $('#formUpload').serialize();
0
Puntos
Por Juliethsanches hace 89 meses
Principiante
Respuesta #6
Como le puedo asignar la carpeta donde las voy a guardar porfas
0
Puntos
Por gerardlor11 hace 42 meses
Principiante
Respuesta #7
gerardlor11 dijo: Como le puedo asignar la carpeta donde las voy a guardar porfas
<?php 
if (isset($_FILES['image'])) {
	move_uploaded_file($_FILES['image']['tmp_name'], 'nombre_de_la_carpeta/'.$_FILES['image']['name']);
}
?>
0
Puntos
Por alber hace 42 meses
Administrador
Compartir en facebook
Compartir en twitter
Compartir
Para comentar Inicia sesión o Registrate