如何在PHP Contact表单的每个不同字段中显示错误消息？

编程问答 2022-08-15

问题描述

我正在关注tutorial，并填写了此联系表。它工作正常，但我想在每个字段中显示不同的消息，而不是使用一个框。我试图移动

<?PHP if($msg != ''): ?>
            <div class="alert <?PHP echo $msgClass; ?>"><?PHP echo $msg;?></div>
         <?PHP endif; ?>

在输入字段下面，它在该位置显示效果很好，但是它一次只显示同一条消息。它不会单独显示其他消息。我从这里如何处理？

body {
    font-size:10px;
    font-family:sans-serif,"Open-sans";
    margin:0;
    padding:0;
    Box-sizing:border-Box;
    letter-spacing:0.1rem;
}

.navbar {
    background:#333;
    width:100%;
}

.container {
    max-width:1100px;
    margin:auto;
}

.navbar-header {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
}

.navbar-brand {
    font-size:1.5rem;
    padding:1rem;
    color:#fff;
    text-decoration:none;
}

form {
    font-size:1.3rem;
}

.form-group {
    display:flex;
    flex-direction: column;
    margin:1.5rem;
}

label {
    color:#333;
    margin-bottom:0.7rem;
}

input,textarea {
    max-width:100%;
    border:0.5px solid darkslategray;
    padding:1.3rem;
    font-size:1.5rem;
}

button {
    background:rgb(67,130,211);
    color:#fff;
    font-size:1.2rem;
    padding:1rem;
    margin:1.5rem;
    border:none;  
}

.alert {
    margin:1.5rem;
    padding:1.5rem;
    font-size:1.5rem;
    color:#fff; 
}

.alert-danger {
    background-color:rgb(219,54,48);
}

.alert-success {
    background-color:rgb(28,160,39);
}
<?PHP 
    // Message Vars
    $msg = '';
    $msgClass = '';
    
    // Check for submit
    if(filter_has_var(INPUT_POST,'submit')){
        // Get Form Data 
        $name = htmlspecialchars($_POST['name']); 
        $email = htmlspecialchars($_POST['email']);
        $message = htmlspecialchars($_POST['message']);

        // Check required Fields
        if(!empty($email) && !empty($name) && !empty($message)){
            // Passed
            // Check Email 
            if(filter_var($email,FILTER_VALIDATE_EMAIL) === false ){
                // Failed
                $msg = 'Please use a valid email';
                $msgClass = 'alert-danger';
            } else { 
                // Passed
                $toEmail = '[email protected]';
                $subject = 'Contact Request From '.$name;
                $body = '<h2>Contact Request</h2>
                    <h4>Name</h4><p>' .$name. '</p>
                    <h4>Email</h4><p>' .$email. '</p>
                    <h4>Message</h4><p>' .$message.'</p>
                    ';

                    // Email Headers
                    $headers = "MIME-Version: 1.0" . "\r\n";
                    $headers .= "Content-Type:text/html;charaset=UTF-8" . "\r\n";
                    
                    // Additional Headers
                    $headers .= "From: " .$name. "<".$email.">". "\r\n";

                    if(mail($toEmail,$subject,$body,$headers)){
                        // Email Sent
                        $msg = "Your email has been sent";
                        $msgClass = 'alert-success';
                    } else {
                        // Failed
                        $msg = "Your email was not sent";
                        $msgClass = 'alert-danger';
                    }
            }
        } else {
            // Failed
            $msg = 'Please fill in all fields';
            $msgClass = 'alert-danger';
        }
    }
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <Meta charset="UTF-8">
    <Meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Contact US</title>
</head>
<body>
     <nav class="navbar">
        <div class="container">
            <div class="navbar-header">
                <a href="index.PHP" class="navbar-brand">My Website</a>
            </div>
        </div>
     </nav>
     <div class="container">
         <?PHP if($msg != ''): ?>
            <div class="alert <?PHP echo $msgClass; ?>"><?PHP echo $msg;?></div>
         <?PHP endif; ?>
        <form action="<?PHP echo $_SERVER['PHP_SELF'];?>" method="post">
            <div class="form-group">
                <label for="name">Name</label> 
                <input type="text" name="name" class="form-control" value="<?PHP echo isset($_POST['name']) ? $name : ''; ?>">
            </div>
            <div class="form-group">
                <label for="name">Email</label>
                <input type="text" name="email" class="form-control" value="<?PHP echo isset($_POST['email']) ? $email : ''; ?>">
            </div>
            <div class="form-group">
                <label for="name">Message</label>
                <textarea name="message" class="form-control"><?PHP echo isset($_POST['message']) ? $message : ''; ?></textarea>
            </div>
            <button type="submit" name="submit" class="btn btn-primary">
            Submit</button>
        </form>
     </div>
</body>
</html>

My current form

这是我当前的表格。

Form I want to replicate

我想让它看起来像这样。

解决方法

您可以将验证警告存储在与字符串相对的数组类型变量中。

例如，这一行：

$ msg ='请使用有效的电子邮件';

您可以改为这样做：

$msg['email'] = 'Please use a valid email';

此外，我认为您想验证是否每个必填字段都具有自己的单独if检查项，而不是全部都没有，例如：

if（！empty（$ email）&&！empty（$ name）&&！empty（$ message））{

您可以实现为：

if (empty($email) || filter_var($email,FILTER_VALIDATE_EMAIL) === false) {
    $msg['email'] = 'Please use a valid email';
}

if (empty($name)) {
    $msg['name'] = 'Please enter a name';
}

if (empty($message)) {
    $msg['message'] = 'Please enter a message';
}

然后在HTML部分的每个相关输入字段下方，您可以添加：

<div class="form-group">
    <label for="name">Name</label> 
    <input type="text" name="name" class="form-control" value="<?php echo isset($_POST['name']) ? $name : ''; ?>">
    
    <?php if(isset($msg['name'])): ?>
       <p> <?php echo $msg['name']; ?>
    <?php endif; ?>
</div>

但是，总的来说，我不得不说这是使用PHP的一种非常古老的方式，您可以将逻辑代码与显示代码混合在一起。

掌握了这些技巧之后，也许您想研究Laravel，Symfony甚至是CodeIgniter的工作原理，在这里您可以使用所谓的MVC将显示与逻辑分开。

同样，您最终可以使用诸如Blade或类似工具的模板引擎来回显变量。

,

您可以将$msg变量用作数组而不是字符串来保存特定字段的错误。

<?php
    $msg = [];
    
    if(filter_has_var(INPUT_POST,'submit')){
        //...

        // Check Required Fields
        if(!empty($email) && !empty($name) && !empty($message)){
  
            if(filter_var($email,FILTER_VALIDATE_EMAIL) === false ){
                $msg['email'] = [
                    'msg' => 'Please use a valid email'
                    'class' => 'alert-danger'
                ];
            } else { 
                //...

                    if(mail($toEmail,$subject,$body,$headers)){
                        // Email Sent
                        $msg['default'] = [
                            'msg' => 'Your email has been sent'
                            'class' => 'alert-success'
                         ];
                    } else {
                        // Failed
                        $msg['default'] = [
                            'msg' => 'Your email was not sent'
                            'class' => 'alert-danger'
                         ];
                    }
            }
        } else {
            // Failed
           $msg['default'] = [
                'msg' => 'Please fill in all fields'
                'class' => 'alert-danger'
             ];
        }
    }
?>

现在，在HTML中，您可以检查是否存在特定的错误或消息，并在正确的位置显示它。顶部的默认消息和电子邮件输入下的电子邮件错误：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Contact US</title>
</head>
<body>
     <nav class="navbar">
        <div class="container">
            <div class="navbar-header">
                <a href="index.php" class="navbar-brand">My Website</a>
            </div>
        </div>
     </nav>
     <div class="container">

        <!-- HERE -->
         <?php if(isset($msg['default'])): ?>
            <div class="alert <?php echo $msg['default']['class']; ?>"><?php echo $msg['default']['msg']?></div>
         <?php endif; ?>

        <form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
            <!-- ... -->

            <div class="form-group">
                <label for="name">Email</label>
                <input type="text" name="email" class="form-control" value="<?php echo isset($_POST['email']) ? $email : ''; ?>">

                <!-- AND HERE -->
                <?php if(isset($msg['email'])): ?>
            <div class="alert <?php echo $msg['email']['class']; ?>"><?php echo $msg['email']['msg']?></div>
         <?php endif; ?>
            </div>

            <!-- ... -->
        </form>
     </div>
</body>
</html>

实际上，您也可以对其他任何想要的输入做同样的事情。

contact-form