HTML 和 PHP 文件之间的动态表单验证。这可能吗？

Question

目前在我的网站 JorgeGoris.com 上，我有一个表单指向一个名为 form_process.php 的 php 文件以进行验证。我的问题是我从来没有看到我已经实现的验证或成功消息发生，因为当我点击提交时，我被重定向到 form_process.php 我希望这在同一页面中动态发生。我怎样才能做到这一点？这是我的表单和 php 代码：

<?php

// define variables and set to empty values
$firstName_error = $email_error = $phone_error = "";
$firstName = $lastName = $email = $phone = $message = $success = "";

//form is submitted with POST method
if ($_SERVER["REQUEST_METHOD"] == "POST") {
  if (empty($_POST["firstname"])) {
    $firstName_error = "First name is required";
  } else {
    $firstName = test_input($_POST["firstname"]);
    // check if name only contains letters and whitespace
    if (!preg_match("/^[a-zA-Z ]*$/",$firstName)) {
      $firstName_error = "Only letters and white space allowed"; 
    }
  }

    if (empty($_POST["email"])) {
    $email_error = "Email is required";
  } else {
    $email = test_input($_POST["email"]);
    // check if e-mail address is well-formed
    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
      $email_error = "Invalid email format"; 
    }
  }
  
  if (empty($_POST["phone"])) {
    $phone_error = "Phone is required";
  } else {
    $phone = test_input($_POST["phone"]);
    // check if e-mail address is well-formed
    if (!preg_match("/^(\d[\s-]?)?[\(\[\s-]{0,2}?\d{3}[\)\]\s-]{0,2}?\d{3}[\s-]?\d{4}$/i",$phone)) {
      $phone_error = "Invalid phone number"; 
    }
  }

  if (empty($_POST["message"])) {
    $message = "";
  } else {
    $message = test_input($_POST["message"]);
  }
  
  if ($firstName_error == '' and $email_error == '' and $phone_error == '' ){
      $message_body = '';
      unset($_POST['submit']);
      foreach ($_POST as $key => $value){
          $message_body .=  "$key: $value\n";
      }
      
      $to = 'J_goris@live.com';
      $subject = 'Potential Client/Employer-JorgeGoris';
      if (mail($to, $subject, $message_body)){
          $success = "Message sent, I'll get back to you shortly!";
          $firstName = $email = $phone = $message = '';
          echo "<h1>Got it! I'll get back to you shortly!</h1>";
      }
  }
  
}

function test_input($data) {
  $data = trim($data);
  $data = stripslashes($data);
  $data = htmlspecialchars($data);
  return $data;
}

?>

<form action="form_process.php" method="post" name="contact_form">
				<div class="form-row">
					<div class="col-lg-3 offset-lg-3 col-sm-12">
						<input type="text" class="form-control" placeholder="First Name *" name="firstname">
						<span class="error"><?php= $firstName_error ?></span>
					</div><!--end col-->
					<div class="col-lg-3 col-sm-12">
						<input type="text" class="form-control" placeholder="Last Name" name="lastname">
					</div><!--end col-->
				</div><!--end row-->
				<div class="form-row">
					<div class="col-lg-3 offset-lg-3 col-sm-12">
						<input type="text" class="form-control" placeholder="Phone Number" name="phone">
						<span class="error"><?php= $phone_error ?></span>
					</div><!--end col-->
					<div class="col-lg-3 col-sm-12">
						<input type="email" class="form-control" placeholder="Email *" name="email">
						<span class="error"><?php= $email_error ?></span>
					</div><!--end col-->
				</div><!--end row-->
				<div class="row">
					<div class="col-lg-5 offset-lg-3 col-sm-12">
						<textarea class="form-control" rows="5" placeholder="Tell me a little about your project. Budget details are also appreciated. *" name="message"></textarea>
					</div><!--end col-->
				</div><!--end row-->
				<div class="success"><?php= $success; ?></div>
				<button type="submit" class="button" name="submit">Submit</button>
			</form><!--end form-->

Answer 1

实现所需功能的正确方法是将表单数据发送到负责加载表单的 PHP 文件（或函数）。加载表单的 PHP 代码应该是有条件的。例如，您可以检查提交的 post-data 中的错误，如果有错误，除了表单的正常 HTML 代码外，还应输出一些显示错误的 HTML 代码。

在您的情况下，当您点击提交按钮时，您看不到任何内容，因为您的表单指向的 PHP 脚本不会输出包含该表单的页面的 HTML。