0

Estoy enviando un correo en PHP utilizando la librería php mailer pero el problema está en que quiero que mientras se envié el correo el botón diga loading y después que diga se ha enviado exitosamente su correo revise la bandeja de entrada

Código PHP:

//send mails

$mail->IsSMTP();
$mail->SMTPDebug = 0;
$mail->Helo = "smtp.gmail.com"; // nombre del dominio de primer nivel
$mail->SMTPAuth = true;
$mail->SMTPSecure = "ssl";
$mail->Host = "smtp.gmail.com"; //servidor donde se enviara el email
$mail->Port = "465";
$mail->Username = "[email protected]"; //cuenta que enviara los correos
$mail->Password = "123456"; //contraseña de la cuenta
$mail->From = "[email protected]"; // correo de quien lo envia
$mail->FromName = 'titulo'; //nombre o titulo referente al destinatario
$mail->Subject = 'sub'; //titulo que aparece despues de quien lo envia
$mail->IsHTML(true);
$mail->AddAddress([email protected]); //para quien va
$mail->Body = "ok"; //cuerpo del mensaje
$mail->CharSet = 'UTF-8';

if(!$mail->Send()){
    echo 'Mailer Error: ' . $mail->ErrorInfo;
} else {
   /* aqui el mensaje que se a enviado exitosamente */
}

Código javascript:

var url = "a.php";
$.ajax({
  type: "POST",
  url: url,
  data: $("#3as3dsad22s1").serialize(),
  success: function(data) {
    $("#asd2a2sd23333asd").html(data);
  }
});
return false;

Les agradezco la ayuda

4
  • Y qué hiciste desde la vista (html)? Para poder ayudarte a hacer lo que necesitás.
    – Kleith
    Commented el 12 jun. 2018 a las 19:55
  • es un formulario que envio por ajax me retorna informacion sin recargar pero quiero que me retorne que el boton por ejemplo de enviar correo cuando le den click diga espere y cuando se envie el correo diga correo enviado exitosamente Commented el 12 jun. 2018 a las 20:01
  • Gracias, podrás agregar ese fragmento en donde hacés la petición por ajax? Eso va a servir como para generar una respuesta.
    – Kleith
    Commented el 12 jun. 2018 a las 20:04
  • claro que si: var url = "a.php"; $.ajax({ type: "POST", url: url, data: $("#3as3dsad22s1").serialize(), success: function(data) { $("#asd2a2sd23333asd").html(data); } }); return false; Commented el 12 jun. 2018 a las 20:06

2 respuestas 2

0

Tan solo podrías usar la función beforeSend() del ajax para agregarle el texto de loading al botón y luego, una vez que termine de ejecutarse, mostrar el mensaje ya se de éxito o no.

HTML

<button id="send-mail">Enviar mail</button>
<div id="status-mail"></div>

Javascript

$('#send-mail').on('click', function() {
  var url = "a.php";
  var self = $(this);
  var textButton = self.text();

  $.ajax({
    type: "POST",
    url: url,
    data: $("#miform").serialize(),
    beforeSend: function() {
      // cambio  el texto del botón antes de enviarlo por ajax
      self.text('loading...');
    },
    success: function(data) {
      // vuelvo a poner el botón el mismo texto que tenía
      self.text(textButton);

      // agrego el texto que devuelve el PHP
      $('#status-mail').text(data.msg);
    }
  });
});

PHP

//send mails

$mail->IsSMTP();
$mail->SMTPDebug = 0;
$mail->Helo = "smtp.gmail.com"; // nombre del dominio de primer nivel
$mail->SMTPAuth = true;
$mail->SMTPSecure = "ssl";
$mail->Host = "smtp.gmail.com"; //servidor donde se enviara el email
$mail->Port = "465";
$mail->Username = "[email protected]"; //cuenta que enviara los correos
$mail->Password = "123456"; //contraseña de la cuenta
$mail->From = "[email protected]"; // correo de quien lo envia
$mail->FromName = 'titulo'; //nombre o titulo referente al destinatario
$mail->Subject = 'sub'; //titulo que aparece despues de quien lo envia
$mail->IsHTML(true);
$mail->AddAddress([email protected]); //para quien va
$mail->Body = "ok"; //cuerpo del mensaje
$mail->CharSet = 'UTF-8';

if(!$mail->Send()){
    echo json_encode(array('msg' => 'Mailer Error: ' . $mail->ErrorInfo));
} else {
    /* aqui el mensaje que se a enviado exitosamente */
    echo json_encode(array('msg' => 'El mail se envió exitosamente.'));
}
1
  • Gracias es lo que necesitaba solo que me gustaría que el botón se deshabilitara para que el usuario espere mientras la función se realiza Commented el 13 jun. 2018 a las 8:38
0

ojala te ayude. Creo que sería algo así:

Supongamos que tu botón esta:

<button id="btnEnviarMail">Enviar Mail</button>

Entonces en tu método:

$('#btnEnviarMail').click( function() { 
$('#btnEnviarMail').text('Enviando correo...')
var url = "a.php";
$.ajax({
  type: "POST",
  url: url,
  data: $("#3as3dsad22s1").serialize(),
  success: function(data) {
    $('#btnEnviarMail').text('Correo enviado!')
  },
 error: function(data) {
 $('#btnEnviarMail').text('Error al enviar')
}
});
return false;
})    

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.