Blog de Gonzalo

SUBIR ARCHIVO CON AJAX Y JQUERY

Nunca he tenido la necesidad de subir un archivo con ajax pero hace poco vi en una página web que convertía doc a pdf que tiene implementado la subida de archivos con drag and drop y la verdad es que resulta bastante útil y encima con jquery es bastante más sencillo, como otras tantas cosas. Voy a poner un ejemplo que he visto en internet ya que creo que es bastante sencillo y claro:


$("#formuploadajax").on("submit", function(e){
e.preventDefault();
var f = $(this);
var formData = new FormData(document.getElementById("id_formulario"));
$.ajax({
url: "procesaformulario.php",
type: "post",
dataType: "html",
data: formData,
cache: false,
contentType: false,
processData: false
})
.done(function(res){
$("#mensaje").html("Respuesta: " + res);
});
});

Del ejemplo anterior hay que destacar la linea var formData = new FormData(document.getElementById("formuploadajax")); que añade todos los datos del formulario para ser enviados al servidor, incluyendo los campos file.

Compartir en twitter