javascript - 如何在模态中回显模态

Question

我正在开发一个登录密码重置功能，当用户单击“忘记密码”超链接时，它将切换一个模式（forgotpassdialog），该模式具有输入电子邮件的列。请参阅下面的图片。

当用户输入电子邮件并单击提交按钮时，如何回显另一个模式（密码发送）？这样我就可以通知用户电子邮件已发送到他们的收件箱。

以下是我到目前为止所尝试的。当我输入电子邮件并提交时，它只会将我带到 std_retrieve.php 页面。右边它应该留在 login.php 并显示密码发送模式

1. 登录 PHP

<div class="modal fade" id="forgotpassdialog" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
    aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">

                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body text-center">
                <p class="stdforgot-heading">Forgot your password?</p>
                <div class="desc-text">Enter your email below to receive your password reset instructions.<br><br></div>
                <form action="std_retrieve.php" method="post">
                    <div class="form-group col-md-10 input-forgot-div">
                        <input name="email" type="email" class="form-control input-fields" id="exampleInputEmail1"
                            aria-describedby="emailHelp" placeholder="Enter email" required="true">
                    </div>
                    <center>
                        <button name="submit" type="submit" class="btn btn-primary btn-login-form">Send Email</button>
                    </center>
                </form>
            </div>
        </div>
    </div>
</div>

2. std_retrieve.php

<?php 
include
  include('admin/include/dbcon.php');
 include('include/header.php');

    if (isset($_POST['submit'])) {
  $inpemail = $_POST['email'];
  $data = mysqli_query($sql_con,"select * from students where stdemail = '$inpemail'");
  $row = mysqli_fetch_array($data);
  $email = $row['stdemail'];
  if($email != $inpemail){
    echo "<script>alert('Email does not exist')</script>";
    echo "<script>window.location='studentlogin.php'</script>";
    return false;
  }
require 'PHPMailer-master/PHPMailerAutoload.php';

$mail = new PHPMailer();
  
  //Enable SMTP debugging.
  $mail->SMTPDebug = 0;
  //Set PHPMailer to use SMTP.
  $mail->isSMTP();
  //Set SMTP host name
  $mail->Host = "XXXX";
  $mail->SMTPOptions = array(
                    'ssl' => array(
                        'verify_peer' => false,
                        'verify_peer_name' => false,
                        'allow_self_signed' => true
                    )
                );
  //Set this to true if SMTP host requires authentication to send email
  $mail->SMTPAuth = TRUE;
  //Provide username and password
  $mail->Username = "[e-mail]";
  $mail->Password = "xxxx";
  //If SMTP requires TLS encryption then set it
  $mail->SMTPSecure = "false";
  $mail->Port = 587;
  //Set TCP port to connect to
  
  $mail->From = "[e-mail]";
  $mail->FromName = "xxx";
  
  $mail->addAddress($row["stdemail"]);
  
  $mail->isHTML(true);
 
  $mail->Subject = "XXX";
  $mail->Body = "XXX"];
  $mail->AltBody = "This is the plain text version of the email content";
  if(!$mail->send())
  {
   // echo "Mailer Error: " . $mail->ErrorInfo;
  }
  else
  {

   echo "<script>$(document).ready(function(){ $('#passwordsent').modal('show'); });</script>";
  }
  }
  
   ?>

<!-- Password sent modal -->
<div class="modal fade" id="passwordsent" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title forgot-heading" id="exampleModalLabel">Mail Sent!</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div><br>
            <center><img src="../images/emailsent.svg" width="100" height="100"></center>
            <div class="modal-body text-center">
                <p class="password-errortxt">Email sent! Check you Inbox</p>
            </div>
        </div>
    </div>
</div>

标签： javascriptphphtml