Bootstrap v4形成红色错误边框

时间:2016-07-04 20:47:31

标签: php html forms twitter-bootstrap-4

我只是尝试使用Bootstrap v4的联系表单和一些PHP验证,但是正在努力解决红色错误边界。

当电子邮件输入不正确时,会出现带有文本气球的红色边框,并在其下方显示红色错误消息。这就是我想要的。但是在Name输入中不会发生这种情况。我只是看不出它出了什么问题。我检查了所有课程,但他们都是完全相同的。

有人可以帮忙吗?

到目前为止,我只知道名字和电子邮件!preg_match。

<?php
if (isset($_POST["submit"])) {
    $name = $_POST['name'];
    $email = $_POST['email'];
    $message = $_POST['message'];
    $human = intval($_POST['human']);
    $from = 'Demo Contact Form'; 
    $to = 'example@bootstrapbay.com'; 
    $subject = 'Message from Contact Demo ';

    $body = "From: $name\n E-Mail: $email\n Message:\n $message";

    // Check if name has been entered
    if (!preg_match("/^[a-zA-Z]+[a-zA-Z[:space:]]{2,}$/", $_POST['name'])) { 
        $errName = 'Please enter your name';
    }

    // Check if email has been entered and is valid
    if (!preg_match("/^([a-zA-Z0-9])+([\.a-zA-Z0-9_-])*@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-]+)*\.([a-zA-Z]{2,6})$/", $_POST['email'])) { 
        $errEmail = 'Please enter a valid email address';
    } 

    //Check if message has been entered
    if (!$_POST['message']) {
        $errMessage = 'Please enter your message';
    }
    //Check if simple anti-bot test is correct
    if ($human !== 5) {
        $errHuman = 'Your anti-spam is incorrect';
    }

    // If there are no errors, send the email
    if (!$errName && !$errEmail && !$errMessage && !$errHuman) {
    if (mail ($to, $subject, $body, $from)) {
        $result='<div class="alert alert-success">Thank You! I will be in touch</div>';
    } else {
        $result='<div class="alert alert-danger">Sorry there was an error sending your message. Please try again later</div>';
    }
      }
    }
?>

<form class="form-horizontal" role="form" method="post" action="contact_test.php">
<div class="form-group">
    <label for="name" class="col-sm-2 control-label">Name</label>
    <div class="col-sm-10">
        <input type="text" class="form-control" id="name" name="name" placeholder="First & Last Name" value="<?php echo htmlspecialchars($_POST['name']); ?>">
        <?php echo "<p class='text-danger'>$errName</p>";?>
    </div>
</div>

<div class="form-group">
    <label for="email" class="col-sm-2 control-label">Email</label>
    <div class="col-sm-10">
        <input type="email" class="form-control" id="email" name="email" placeholder="example@domain.com" value="<?php echo htmlspecialchars($_POST['email']); ?>">
        <?php echo "<p class='text-danger'>$errEmail</p>";?>
    </div>
</div>
<div class="form-group">
    <label for="message" class="col-sm-2 control-label">Message</label>
    <div class="col-sm-10">
        <textarea class="form-control" rows="4" name="message"><?php echo htmlspecialchars($_POST['message']);?></textarea>
        <?php echo "<p class='text-danger'>$errMessage</p>";?>
    </div>
</div>
<div class="form-group">
    <label for="human" class="col-sm-2 control-label">2 + 3 = ?</label>
    <div class="col-sm-10">
        <input type="text" class="form-control" id="human" name="human" placeholder="Your Answer">
        <?php echo "<p class='text-danger'>$errHuman</p>";?>
    </div>
</div>
<div class="form-group">
    <div class="col-sm-10 col-sm-offset-2">
        <input id="submit" name="submit" type="submit" value="Send" class="btn btn-primary">
    </div>
</div>
<div class="form-group">
    <div class="col-sm-10 col-sm-offset-2">
        <?php echo $result; ?>  
    </div>
</div>
</form> 

0 个答案:

没有答案