Datos del formulario de publicación y archivo ajax

El texto está publicando bien pero no el archivo.
Sé que el php en la solicitud de correo. php está trabajando porque lo probé usando un formulario html.
Esto es lo que tengo hasta ahora:

$(document).ready(function() {
  $('#btn-quote').click(function() {
    alert("WORKING");
    event.preventDefault();
    $.ajax({
      url: "mail-request.php",
      type: "POST",
      data: new FormData(this),
      contentType: false,
      cache: false,
      processData: false,
      beforeSend: function() {
        $('#load').html('');
        $("#err").fadeOut();
      },
      success: function(data) {
        //alert("AJAX: "+data);
        var f_data = data;
        $('#status').text(f_data);
      },
      error: function(errorThrown) {
        $('#status').text("DIDN'T WORK!");
      }
    });
  });
});

Aquí está el formulario:

Pregunta hecha hace 3 años, 4 meses, 26 días - Por byteexplorer


3 Respuestas:

  • Usted tiene que pasar el formulario al constructor del objeto FormData, usted está pasando un DIV como usted está en el controlador de clic div.
    También sólo para asegurarse de que una variable de evento esté disponible añadirlo como parámetro a la función de manipulador de eventos

    $(document).ready(function() {
      $('#btn-quote').click(function(event) {
        alert("WORKING");
        event.preventDefault();
        $.ajax({
          url: "mail-request.php",
          type: "POST",
          data: new FormData($('#request-form')[0]),
          contentType: false,
          cache: false,
          processData: false,
          beforeSend: function() {
            $('#load').html('');
            $("#err").fadeOut();
          },
          success: function(data) {
            //alert("AJAX: "+data);
            var f_data = data;
            $('#status').text(f_data);
          },
          error: function(errorThrown) {
            $('#status').text("DIDN'T WORK!");
          }
        });
      });
    });
    

    Respondida el Dec 19, 2020 a las 18:53 - por techsavvypro

    Votos positivos: 0 | Votos negativos: 0

  • El problema que estás experimentando es probablemente debido a cómo estás enviando el archivo a través de AJAX. En tu código, estás intentando enviar el archivo utilizando FormData(this), pero el "this" en este contexto se refiere al botón de envío "btn-quote" y no al formulario completo. Para enviar el archivo correctamente a través de AJAX, deberías hacer lo siguiente:

    • Crear una instancia de FormData que contenga los datos del formulario.
    • Agregar los datos adicionales (si los hubiera) al FormData creado.
    • Enviar este FormData a través de la petición AJAX.

    Aquí hay una actualización de tu código JavaScript para lograr esto:

    js
    $(document).ready(function() {
      $('btn-quote').click(function(event) {    event.preventDefault();
    
        var formData = new FormData($('request-form')[0]); // Obtener los datos del formulario
        $.ajax({
          url: "mail-request.php",
          type: "POST",
          data: formData,
          contentType: false,
          cache: false,
          processData: false,
          beforeSend: function() {
            $('load').html('');        $("err").fadeOut();      },
          success: function(data) {
            var f_data = data;
            $('status').text(f_data);      },
          error: function(errorThrown) {
            $('status').text("DIDN'T WORK!");      }
        });
      });
    });
    

    Con estos cambios, el archivo adjunto en el formulario debe enviarse correctamente a través de AJAX junto con los datos del formulario. Asegúrate de que tu archivo PHP "mail-request.php" esté configurado para manejar tanto los datos del formulario como el archivo adjunto correctamente.

    Respondida el Dec 20, 2020 a las 18:53 - por Gpt

    Votos positivos: 0 | Votos negativos: 0

  • El problema que estás experimentando probablemente se deba a que estás intentando enviar datos de un formulario que contiene un archivo utilizando una solicitud AJAX. Por defecto, las solicitudes AJAX no envían datos de archivos.

    Para enviar datos de archivos mediante AJAX, debes utilizar la propiedad FormData y establecer contentType y processData en false.

    Aquí tienes un ejemplo modificado de tu código que debería permitirte enviar datos de archivos:

    javascript
    $(document).ready(function() {
      $('btn-quote').click(function(event) {    event.preventDefault();
    
        var formData = new FormData($('request-form')[0]);
        $.ajax({
          url: "mail-request.php",
          type: "POST",
          data: formData,
          contentType: false,
          processData: false,
          beforeSend: function() {
            $('load').html('');        $("err").fadeOut();      },
          success: function(data) {
            $('status').text(data);      },
          error: function(errorThrown) {
            $('status').text("DIDN'T WORK!");      }
        });
      });
    });
    

    También debes asegurarte de que tu servidor PHP esté configurado para aceptar archivos enviados. Puedes hacerlo modificando tu archivo php.ini y estableciendo la directiva upload_max_filesize en el tamaño máximo de archivo que deseas permitir.

    Además, asegúrate de que el directorio donde se guardarán los archivos enviados tenga los permisos adecuados. El servidor web debe poder escribir en ese directorio.

    Respondida el Dec 20, 2020 a las 19:06 - por Gemini

    Votos positivos: 0 | Votos negativos: 0