0

Tengo un modal hecho con Bootstrap que contiene campos de formulario. Estoy Usando PHP Mailer y SMTP (con una cuenta gmail) para enviar dicho formulario a un correo. Todo bien, lo he probado y si envía, pero tengo algunos otros inconvenientes:

  1. ¿Cómo hago para que el modal cuando pulso el botón de "enviar requerimiento" el modal no se cierre y notifique al usuario que efectivamente los ha enviado. Actualmente si envía pero el modal se cierra y no notifica nada, pasa algo curioso que cuando vuelvo a abrir el modal recién aparece la notificación de que han sido enviado los datos.

  2. ¿Cuál es la mejor/rápida manera para validar este formulario?

  3. ¿Cómo hago para replicar este modal en otras páginas sin volver a escribir el mismo código? ¿Puedo usar un include?

  4. Tengo problemas usando SMTP en GoDaddy, ya es la 2da vez que me pasa. Me sale el siguiente error: "SMTP Error: Could not connect to SMTP host." Digo esto porque en local (usando XAMP) y en otro proveedor de Hosting funciona correctamente. ¿A alguien más le ha pasado? he leído por ahí que GoDaddy es muy estricto con este tema, si es así. ¿Hay alguna alternativa?

Este es mi código PHP:

<?php
		require_once 'mailer/class.phpmailer.php';
		$mail = new PHPMailer(true);
		if(isset($_POST['btn_send']))
		{
			$categoria  = strip_tags($_POST['categoria']);
            $detalles   = strip_tags($_POST['detalles']);
            $email      = strip_tags($_POST['email']);
            $name       = strip_tags($_POST['name']);
            $telefono   = strip_tags($_POST['telefono']);
			
			$subject    = "Nuevo requerimiento desde khapac.com";	
			$message    = "Hola, ha llegado un nuevo requerimiento desde la web de Khapac.com<br><br>
            Categoría: $categoria<br>
            <hr style='border-top: 1px solid #eaeaea;'>
            Detalles: $detalles<br>
            <hr style='border-top: 1px solid #eaeaea;'>
            Email: $email<br>
            <hr style='border-top: 1px solid #eaeaea;'>
            Nombre: $name<br>
            <hr style='border-top: 1px solid #eaeaea;'>
            Teléfono: $telefono<br>
            <hr style='border-top: 1px solid #eaeaea;'>
            ";
				
			try
			{
				$mail->IsSMTP(); 
				$mail->isHTML(true);
				$mail->SMTPDebug  = 0;                     
				$mail->SMTPAuth   = true;                  
				$mail->SMTPSecure = "ssl";                 
				$mail->Host       = "smtp.gmail.com";      
				$mail->Port       = 465;
				//$mail->AddAddress($email);
				$mail->Username   ="[email protected]";  
				$mail->Password   ="mypassword";
				$mail->SetFrom('[email protected]','Name');
				$mail->AddReplyTo("[email protected]","Name");
                $mail->AddCC('[email protected]', 'Name');
				$mail->Subject    = $subject;
				$mail->Body 	  = $message;
				$mail->AltBody    = $message;
					
				if($mail->Send())
				{
					
					$msg = "<div class='alert alert-success'>
							Gracias ".$name.", En breve te responderemos.
							</div>";
				}
			}
			catch(phpmailerException $ex)
			{
				$msg = "<div class='alert alert-warning'>".$ex->errorMessage()."</div>";
			}
		}			
?>

Este del botón que llama al modal:

<button  type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">Cuéntanos tu caso</button>

Y este del modal:

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
          <div class="modal-dialog" role="document">
            <div class="modal-content">
                
                
                
              
              <div class="modal-body">
                  
                <div class="">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel">Requerimiento</h4><br>
                </div>
             
                  <?php
		          if(isset($msg))
		              {
			         echo $msg;
		              }
		          ?>
                  
                <form method="post">
                    
                    <div class="form-group">
                        <select class="form-control" name="categoria">
                            <option>-- Selecciona un categoría --</option>
                            <option>Branding e identidad de marca</option>
                            <option>Comunicación interna</option>
                            <option>Diseño Editorial</option>
                            <option>Desarrollo Web</option>
                            <option>Multimedia y 3D</option>
                            <option>Redes Sociales</option>
                            <option>Marketing Electrónico</option>
                            <option>Diseño de Empaques</option>
                            <option>Otro</option>
                        </select>
                    </div>
                    
                    
                    <div class="form-group">
                        <textarea class="form-control" rows="4" placeholder="Detalles" name="detalles"></textarea>
                    </div>
                    
                    <div class="form-group">
                        <input class="form-control" type="text" name="email" placeholder="Email" />
                    </div>
                    
                    <div class="row">
                        <div class="form-group col-md-8">
                            <input type="text" class="form-control" placeholder="Nombre" name="name" >
                        </div>
                        <div class="form-group col-md-4">
                            <input type="text" class="form-control" placeholder="Teléfono" name="telefono">
                        </div>
                    </div>
                    
                    <p>Índice de respuesta: 1 hra. aproximadamente.</p><br>
            
                    
                    
                    
                    <div class="text-right">
                        <button type="button" class="btn btn-link" data-dismiss="modal">Cerrar</button>
                        <button class="btn btn-primary" type="submit" name="btn_send">Enviar requerimiento</button>
                    </div>
                    
                    
                </form>
                  
              </div>
              
            </div>
          </div>
        </div>

2
  • Osea, claramente el modal se cerrara, ya que estas saliendo de la pagina donde esta el modal y enviando el formulario por POST, al parecer a la misma pagina. Tendrás que enviar el formulario por AJAX.
    – jolsalazar
    Commented el 22 feb. 2017 a las 21:18
  • Tendrás algún ejemplo de como hacerlo con AJAX? te lo agradezco @jolsalazar Commented el 22 feb. 2017 a las 21:31

0

Tu Respuesta

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

Examina otras preguntas con la etiqueta o formula tu propia pregunta.