带有 PHP 验证的定位错误联系表单答案

【问题标题】：Positioning errors contact form with PHP validation带有 PHP 验证的定位错误联系表单
【发布时间】：2015-05-17 14:23:21
【问题描述】：

我正在尝试创建一个带有 PHP 验证的联系表单，其中错误消息可以位于表单字段的上方、下方或中。现在所有消息一起显示在左上方。我试着做 3 节课： error_name、error-email 和 error_message，我希望这可以将这些消息定位在我想要的位置，但这并没有帮助。有人可以告诉我哪里出错了，或者我怎么能做到这一点。

提前致谢

联系表格如下：

<?php require_once 'validation.php'; ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Forms</title>
<style type="text/css">
 .errorlist, .error input{
    border: 1px solid #f00;
    background: #fdd;
 }
 form.cmxform fieldset {
    margin-bottom: 10px;
 }
 form.cmxform legend {
    padding: 0 2px;
    font-weight: bold;
 }
 form.cmxform label {
    display: inline-block;
    line-height: 1.8;
    vertical-align: top;
 }
 form.cmxform em {
    font-weight: bold;
    font-style: normal;
    color: #f00;
 }
 form.cmxform label {
    width: 100%; /* Width of labels */
 }
 input {
    width: 100%;
    height: 35px;
 }
 .contact {
    width: 100%;
 }
 .formfield {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  } 
</style>
</head>
<body>
 <div class="contact">
   <div class="formfield">
   <form action="index.php" method="post" class="cmxform">

   <p>Please complete the form below. Mandatory fields marked<em>*</em></p>

  <fieldset>
    <div class="fieldset">
      <legend>Delivery Details</legend>

          <input id="name" class="error_name" name="name" placeholder="What is your name?" value="<?php echo isset($_POST['name']) ? htmlspecialchars($_POST['name']) : '' ?>" 
          />
          <div class="error_name"></div>
          <input id="email" name="email" placeholder="email" value="<?php echo isset($_POST['email']) ? htmlspecialchars($_POST['email']) : '' ?>" />
          <div class="error_email"></div>

          <input id="message" class="error_message" name="message" placeholder="message" value="<?php echo isset($_POST['message']) ? htmlspecialchars($_POST['message']) : '' ?>" />

          <input type="submit" value="Verstuur" />
       </div>
     </fieldset>
   </form>
  </div>
 </div>
</body>

</html>

validation.php 看起来像：

<?php
 //  We gaan de errors in een array bijhouden
$aErrors = array();

   if ('POST' == $_SERVER['REQUEST_METHOD']) {

   if ( !isset($_POST['name']) or !preg_match( '~^[\w ]{3,}$~',     $_POST['name'] ) ) {
   $aErrors['name'] = 'Please fill in your name';
}

if ( !isset($_POST['email']) or !preg_match( '~^[a-z0-9][a-z0-9_.\-]*@([a-z0-9]+\.)*[a-z0-9][a-z0-9\-]+\.([a-z]{2,6})$~i', $_POST['email'] ) ) {
$aErrors['email'] = 'Please fill in your e-mail address';
}

if ( !isset($_POST['message']) or !preg_match( '~^[\w\d ]{28,}$~',  $_POST['message'] ) ) {
$aErrors['message'] = 'What would you like to share?';
}

if ( count($aErrors) == 0 ) {

header('Location: http://www.phpfreakz.nl/someotherpage.php');
exit();
}
}

 if ( isset($aErrors['name']) and count($aErrors['name']) > 0 ) {
   print '<div class="error_name">';
   if ( $aErrors['name'] ) {
   print '<div>' . $aErrors['name'] . '</div>';
   }
   print '</div>';
   }

 if ( isset($aErrors['email']) and count($aErrors['email']) > 0 ) {
   print '<div class="error_email">';
   if ( $aErrors['email'] ) {
   print '<div>' . $aErrors['email'] . '</div>';
   }
   print '</div>';
   }

 if ( isset($aErrors['message']) and count($aErrors['message']) > 0 ) {
   print '<div class="error_message">';
   if ( $aErrors['message'] ) {
   print '<div>' . $aErrors['message'] . '</div>';
   }
   print '</div>';
   }
?>

【问题讨论】：

使用 JavaScript 进行验证。我不建议发送服务器请求只是为了查看表单是否填写正确 - 客户端应该这样做:)
我认为（查看互联网）服务器端验证是最好的方法，因此在客户端关闭 Java 时无法通过验证。
任何网页都是基于 HTML、CSS 和 JavaScript 作为前端的。 Javascript 永远不会关闭，因为如果关闭，您将看不到 99% 的网站。
@Yair.R 是的，但是任何不怀好意的人仍然可以关闭 javascript。如果在没有 javascript 的情况下网站不可见（当然并非总是如此），他/她仍然可以通过简单地将 POST 数据发送到服务器或编辑一些 javascript 来搞乱系统。

标签： php html forms validation

【解决方案1】：

不要立即打印错误，而是将它们保存在数组中，稍后再打印。首先在validation.php 中添加空字符串，以确保您不打印不存在的值。名称错误示例：

<?php
 //  We gaan de errors in een array bijhouden
$aErrors = array();
$aErrors['name'] = '';


 //..Rest of your validation script here

然后在联系表单中更改：

<div class="error_name"></div>

到这里：

<div class="error_name"><?php print $aErrors['name'];?></div>

Ps：我没有足够的评论，但你是对的，永远不要依赖客户端对表单的评估，因为每个用户都可以禁用 javascript。最好的方法是两者都做，但如果您不想这样做，请始终保持 php 验证。

【讨论】：