2

Hola tengo un problema al tratar de enviar datos y tambien un archivo de imagen por ajax:

el archivo lo obtengo asi:

var form_data = new FormData($("#formulario")[0]); //solo existe 1 input file en ese form

ademas tengo datos como:

nombre: "Jhon",
datos: array[1,2,3,4]

Lo que deseo hacer es enviar por ajax ambos, tanto el archivo como los datos.

Este es el codigo que tengo.

 $.ajax({
    //data: form_data //Cuando envio solo el archivo - funciona
   data: {
     nombre:"Jhon",
     datos: array[1,2,3,4],
     imagen: form_data 
    },//Cuando envio de esta manera sale error.
    url: "php/recibo.php",
    type: "POST",
    contentType: false,
    processData: false,
    beforeSend: function() {}
  }).done(function(data) {
    console.log(data);
  });

Alguna sugerencia? Gracias

2 respuestas 2

0

Buenas te recomiendo realizar esta tarea utilizando FormData(), que envia el formulario completo, puedes buscar información aquí mismo, o en google, si no sabes como recuperar los datos en el php dímelo en comentario y te ayudo

 $("#formulario").on('submit', function(e){
  $.ajax({
    //data: form_data //Cuando envio solo el archivo - funciona
   data: {
     new FormData(this),
    },//Cuando envio de esta manera sale error.
    url: "php/recibo.php",
    type: "POST",
    contentType: false,
    processData: false,
    beforeSend: function() {}
  }).done(function(data) {
    console.log(data);
  });
}
0

Lo que puedes es enviar todo el contenido del formulario si es que tus inputs esta dentro de uno, en caso contrario utiliza el método formData.append para agregar información a tu objeto

ejemplo:

    var formElement = document.getElementById("#formulario");
    formData = new FormData(formElement);
    formData.append('datos', new Array(1,2,3,4));
    formData.append("nombre","Jhon");// esto si requieres agregar un dato a tu objeto
    $.ajax({
        //data: form_data //Cuando envio solo el archivo - funciona
        data: formData,
        url: "php/recibo.php",
        type: "POST",
        contentType: false,
        processData: false,
        beforeSend: function() {}
      }).done(function(data) {
        console.log(data);
      });
2
  • Hola, gracias por tu respuesta, he utilizado esa funcion, pero los arreglos que tengo los convierte en string "1,2,3,4" y llegan al controlador de esa manera. y con la manera normal enviando datos en data funciona pero no he logrado enviar ambos , archivo y datos. Commented el 3 oct. 2019 a las 18:11
  • uliliza formData.append('datos', new Array(1,2,3,4)) Commented el 3 oct. 2019 a las 18:17

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.