Javascript 通过PHP在同一页面中显示HTML联系人表单的弹出消息_Javascript_Php_Html_Forms

Javascript 通过PHP在同一页面中显示HTML联系人表单的弹出消息

javascript php html forms

Javascript 通过PHP在同一页面中显示HTML联系人表单的弹出消息,javascript,php,html,forms,Javascript,Php,Html,Forms,我在index.html上有一个与contact.php文件一起工作的联系人表单。我需要在提交“message sent”或“something Out Error”表单后显示一条弹出消息，而不离开index.html。目前，它在空白页上的弹出窗口中显示消息我真的试图解决它，我在这里检查了许多类似的问题，事实是我对php和js是新手（我像Jon Snow，我什么都不知道），我只是无法找到解决我的问题的方法我感谢任何帮助：） *PHP代码： <?php if($_POST) {

我在index.html上有一个与contact.php文件一起工作的联系人表单。我需要在提交“message sent”或“something Out Error”表单后显示一条弹出消息，而不离开index.html。目前，它在空白页上的弹出窗口中显示消息

我真的试图解决它，我在这里检查了许多类似的问题，事实是我对php和js是新手（我像Jon Snow，我什么都不知道），我只是无法找到解决我的问题的方法

我感谢任何帮助：）

*PHP代码：

<?php
  
if($_POST) {
    $visitor_name = "";
    $visitor_email = "";
    $email_title = "";
    $concerned_department = "";
    $visitor_message = "";
    $email_body = "<div>";
      
    if(isset($_POST['visitor_name'])) {
        $visitor_name = filter_var($_POST['visitor_name'], FILTER_SANITIZE_STRING);
        $email_body .= "<div>
                           <label><b>Visitor Name:</b></label>&nbsp;<span>".$visitor_name."</span>
                        </div>";
    }
 
    if(isset($_POST['visitor_email'])) {
        $visitor_email = str_replace(array("\r", "\n", "%0a", "%0d"), '', $_POST['visitor_email']);
        $visitor_email = filter_var($visitor_email, FILTER_VALIDATE_EMAIL);
        $email_body .= "<div>
                           <label><b>Visitor Email:</b></label>&nbsp;<span>".$visitor_email."</span>
                        </div>";
    }
      
    if(isset($_POST['email_title'])) {
        $email_title = filter_var($_POST['email_title'], FILTER_SANITIZE_STRING);
        $email_body .= "<div>
                           <label><b>Reason For Contacting Us:</b></label>&nbsp;<span>".$email_title."</span>
                        </div>";
    }
      
    if(isset($_POST['concerned_department'])) {
        $concerned_department = filter_var($_POST['concerned_department'], FILTER_SANITIZE_STRING);
        $email_body .= "<div>
                           <label><b>Concerned Department:</b></label>&nbsp;<span>".$concerned_department."</span>
                        </div>";
    }
    
    
    if(isset($_POST['visitor_message'])) {
        $visitor_message = htmlspecialchars($_POST['visitor_message']);
        $email_body .= "<div>
                           <label><b>Visitor Message:</b></label>
                           <div>".$visitor_message."</div>
                       </div>";
    }
    
    
    if($concerned_department == "billing") {
        $recipient = "test@mail.com";
    }
    else if($concerned_department == "marketing") {
        $recipient = "test@mail.com";
    }
    else if($concerned_department == "technical support") {
        $recipient = "test@mail.com";
    }
    else {
        $recipient = "test@mail.com";
    }
    

    $email_body .= "</div>";
 
    $headers  = 'MIME-Version: 1.0' . "\r\n"
    .'Content-type: text/html; charset=utf-8' . "\r\n"
    .'From: ' . $visitor_email . "\r\n";

    
  
    if(mail($recipient, $email_title, $email_body, $headers)) {
        echo '<script type="text/javascript"> window.onload = function(){
          alert("Thank you for contacting us. You will get a reply as soon as possible.");
        }</script>';
      

    } else {
      echo '<script type="text/javascript"> window.onload = function(){
        alert("We are sorry but the email did not go through.");
      }</script>';

    }
      
} else {
    echo '<script>alert("Something went wrong.")</script>';
}
?>

*HTML代码：

<div class="form">
          <form action="/php/contact.php" method="post">
            <div class="elem-group">
              <input type="text" id="name" name="visitor_name" placeholder="Your Name" pattern=[A-Z\sa-z]{3,20} required>
            </div>
            <div class="elem-group">
              <input type="email" id="email" name="visitor_email" placeholder="Your E-mail" required>
            </div>
            <div class="elem-group">
              <input type="text" id="title" name="email_title" required placeholder="Reason For Contacting Us" pattern=[A-Za-z0-9\s]{8,60}>
            </div>
            <div class="elem-group">
              <textarea id="message" name="visitor_message" placeholder="Your Message" required></textarea>
            </div>
            <button type="submit" class="button white">Send Message</button>
          </form>
</div>


发送消息

谢谢

我建议使用警报框作为弹出窗口。其代码为：

示例：
将其添加到您要检查逻辑的文件中：

if (move_uploaded_file($file, $destination)) {
        $sql = "INSERT INTO files (pdf_file) VALUES ('$filename')";
        if (mysqli_query($conn, $sql)) {
            header("location:form5.php?upload=success");
        }
    } else {
        header("location:form5.php?upload=notsuccess");
    }
}

现在将其添加到主文件：

<?php 
      if (isset($_GET['upload'])) {
        if ($_GET['upload'] == 'success') {
          echo '<script>alert("Data added Successfully")</script>';
        }
        if ($_GET['upload'] == 'notsuccess') {
          echo '<script>alert("Data Not added")</script>';
        }
      }
     ?>

我建议使用警报框作为弹出窗口。其代码为：
示例：

将其添加到您要检查逻辑的文件中：
if (move_uploaded_file($file, $destination)) {
        $sql = "INSERT INTO files (pdf_file) VALUES ('$filename')";
        if (mysqli_query($conn, $sql)) {
            header("location:form5.php?upload=success");
        }
    } else {
        header("location:form5.php?upload=notsuccess");
    }
}

现在将其添加到主文件：
<?php 
      if (isset($_GET['upload'])) {
        if ($_GET['upload'] == 'success') {
          echo '<script>alert("Data added Successfully")</script>';
        }
        if ($_GET['upload'] == 'notsuccess') {
          echo '<script>alert("Data Not added")</script>';
        }
      }
     ?>

在我看来，最好的方法是使用AJAX。我的建议是创建一个JS sript来收集数据并执行php代码
html中的小更改：
<div class="form">
    <div class="elem-group">
          <input type="text" id="name" name="visitor_name" placeholder="Your Name" pattern=[A-Z\sa-z]{3,20} required>
    </div>
    <div class="elem-group">
        <input type="email" id="email" name="visitor_email" placeholder="Your E-mail" required>
    </div>
    <div class="elem-group">
        <input type="text" id="title" name="email_title" required placeholder="Reason For Contacting Us" pattern=[A-Za-z0-9\s]{8,60}>
    </div>
    <div class="elem-group">
        <textarea id="message" name="visitor_message" placeholder="Your Message" required></textarea>
    </div>
    <button id="contact_submit" type="submit" class="button white">Send Message</button>
</div>

在PHP中，我唯一要更改的是响应：
<?php
  
if($_POST) {
    $visitor_name = "";
    $visitor_email = "";
    $email_title = "";
    $concerned_department = "";
    $visitor_message = "";
    $email_body = "<div>";
      
    if(isset($_POST['visitor_name'])) {
        $visitor_name = filter_var($_POST['visitor_name'], FILTER_SANITIZE_STRING);
        $email_body .= "<div>
                           <label><b>Visitor Name:</b></label>&nbsp;<span>".$visitor_name."</span>
                        </div>";
    }
 
    if(isset($_POST['visitor_email'])) {
        $visitor_email = str_replace(array("\r", "\n", "%0a", "%0d"), '', $_POST['visitor_email']);
        $visitor_email = filter_var($visitor_email, FILTER_VALIDATE_EMAIL);
        $email_body .= "<div>
                           <label><b>Visitor Email:</b></label>&nbsp;<span>".$visitor_email."</span>
                        </div>";
    }
      
    if(isset($_POST['email_title'])) {
        $email_title = filter_var($_POST['email_title'], FILTER_SANITIZE_STRING);
        $email_body .= "<div>
                           <label><b>Reason For Contacting Us:</b></label>&nbsp;<span>".$email_title."</span>
                        </div>";
    }
      
    if(isset($_POST['concerned_department'])) {
        $concerned_department = filter_var($_POST['concerned_department'], FILTER_SANITIZE_STRING);
        $email_body .= "<div>
                           <label><b>Concerned Department:</b></label>&nbsp;<span>".$concerned_department."</span>
                        </div>";
    }
    
    
    if(isset($_POST['visitor_message'])) {
        $visitor_message = htmlspecialchars($_POST['visitor_message']);
        $email_body .= "<div>
                           <label><b>Visitor Message:</b></label>
                           <div>".$visitor_message."</div>
                       </div>";
    }
    
    
    if($concerned_department == "billing") {
        $recipient = "test@mail.com";
    }
    else if($concerned_department == "marketing") {
        $recipient = "test@mail.com";
    }
    else if($concerned_department == "technical support") {
        $recipient = "test@mail.com";
    }
    else {
        $recipient = "test@mail.com";
    }
    

    $email_body .= "</div>";
 
    $headers  = 'MIME-Version: 1.0' . "\r\n"
    .'Content-type: text/html; charset=utf-8' . "\r\n"
    .'From: ' . $visitor_email . "\r\n";

    
  
    if(mail($recipient, $email_title, $email_body, $headers)) {
        echo 'Thank you for contacting us. You will get a reply as soon as possible.';
    } else {
      echo 'We are sorry but the email did not go through.';

    }
      
} else {
    echo 'Something went wrong.';
}
?>



它应该是有效的，我唯一找不到的是“关注部门”，但我希望你们能自己补充一下。如果您有问题，请告诉我。
在我看来，最好的方法是使用AJAX。我的建议是创建一个JS sript来收集数据并执行php代码
html中的小更改：
<div class="form">
    <div class="elem-group">
          <input type="text" id="name" name="visitor_name" placeholder="Your Name" pattern=[A-Z\sa-z]{3,20} required>
    </div>
    <div class="elem-group">
        <input type="email" id="email" name="visitor_email" placeholder="Your E-mail" required>
    </div>
    <div class="elem-group">
        <input type="text" id="title" name="email_title" required placeholder="Reason For Contacting Us" pattern=[A-Za-z0-9\s]{8,60}>
    </div>
    <div class="elem-group">
        <textarea id="message" name="visitor_message" placeholder="Your Message" required></textarea>
    </div>
    <button id="contact_submit" type="submit" class="button white">Send Message</button>
</div>

在PHP中，我唯一要更改的是响应：
<?php
  
if($_POST) {
    $visitor_name = "";
    $visitor_email = "";
    $email_title = "";
    $concerned_department = "";
    $visitor_message = "";
    $email_body = "<div>";
      
    if(isset($_POST['visitor_name'])) {
        $visitor_name = filter_var($_POST['visitor_name'], FILTER_SANITIZE_STRING);
        $email_body .= "<div>
                           <label><b>Visitor Name:</b></label>&nbsp;<span>".$visitor_name."</span>
                        </div>";
    }
 
    if(isset($_POST['visitor_email'])) {
        $visitor_email = str_replace(array("\r", "\n", "%0a", "%0d"), '', $_POST['visitor_email']);
        $visitor_email = filter_var($visitor_email, FILTER_VALIDATE_EMAIL);
        $email_body .= "<div>
                           <label><b>Visitor Email:</b></label>&nbsp;<span>".$visitor_email."</span>
                        </div>";
    }
      
    if(isset($_POST['email_title'])) {
        $email_title = filter_var($_POST['email_title'], FILTER_SANITIZE_STRING);
        $email_body .= "<div>
                           <label><b>Reason For Contacting Us:</b></label>&nbsp;<span>".$email_title."</span>
                        </div>";
    }
      
    if(isset($_POST['concerned_department'])) {
        $concerned_department = filter_var($_POST['concerned_department'], FILTER_SANITIZE_STRING);
        $email_body .= "<div>
                           <label><b>Concerned Department:</b></label>&nbsp;<span>".$concerned_department."</span>
                        </div>";
    }
    
    
    if(isset($_POST['visitor_message'])) {
        $visitor_message = htmlspecialchars($_POST['visitor_message']);
        $email_body .= "<div>
                           <label><b>Visitor Message:</b></label>
                           <div>".$visitor_message."</div>
                       </div>";
    }
    
    
    if($concerned_department == "billing") {
        $recipient = "test@mail.com";
    }
    else if($concerned_department == "marketing") {
        $recipient = "test@mail.com";
    }
    else if($concerned_department == "technical support") {
        $recipient = "test@mail.com";
    }
    else {
        $recipient = "test@mail.com";
    }
    

    $email_body .= "</div>";
 
    $headers  = 'MIME-Version: 1.0' . "\r\n"
    .'Content-type: text/html; charset=utf-8' . "\r\n"
    .'From: ' . $visitor_email . "\r\n";

    
  
    if(mail($recipient, $email_title, $email_body, $headers)) {
        echo 'Thank you for contacting us. You will get a reply as soon as possible.';
    } else {
      echo 'We are sorry but the email did not go through.';

    }
      
} else {
    echo 'Something went wrong.';
}
?>



它应该是有效的，我唯一找不到的是“关注部门”，但我希望你们能自己补充一下。如果您有问题，请告诉我。
谢谢！我尝试了你的建议，现在它确实在同一个页面中显示了弹出消息。唯一的问题是，现在它不执行任何类型的验证，将输入中填写的内容发送给收件人，甚至发送所有空白。如果输入内容为空白或未正确写入，您必须在php文件中进行验证并发送回显响应。谢谢！我尝试了你的建议，现在它确实在同一个页面中显示了弹出消息。唯一的问题是，现在它不执行任何类型的验证，将输入中填写的内容发送给收件人，甚至所有的空白都要在php文件中进行验证，如果内容为空白或编写不正确，则发送回显响应。