如何验证联系人表单所需字段并相应地显示错误消息
如何验证联系人表单所需字段并相应地显示错误消息
提问于 2014-01-29 05:39:18
我是PHP新手。我尝试使用HTML和PHP创建一个联系人表单。此联系表格在提交时将发送一封邮件给收件人。
下面是 :中联系人表单的代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
<link rel="stylesheet" type="text/css" href="css/coder.css"/>
<style type="text/css">
.bg-color{
background-color:#F9F1E4;
border-radius:5px;
margin:5px;
}
.row_color{
border:2px solid #A40F17;
margin:0px;
}
.footer_class{
background-color:#A40F17;
height:40px;
}
.font_color{
color:#fff;
margin-top:5px;
}
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
background-color: #A40F17;
color: #FFFFFF;
}
.h_color{
background-color:#FFFFFF;
}
.danger{
color:#A40F17;
}
.h_top{
margin-top:30px;
}
.h_height{
height:173px;
}
</style>
</head>
<body>
<header>
<div class="row h_color h_height">
<div class="container">
<div class="col-lg-12">
<div class="col-lg-6">
<a href="" class="navbar-brand"><img class="image-responsive" src="images/logo_rugs.jpg"/></a>
</div>
</div>
</div>
<nav class="navbar navbar-inverse">
<div class="container">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navHeader">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="collapse navbar-collapse navHeader">
<ul class="nav navbar-nav navbar-right">
<li><a href="index.html">Home</a></li>
<li><a href="aboutus.html">About Us</a></li>
<li><a href="products.html">Products</a></li>
<li><a href="gallery.html">Gallery</a></li>
<li class="active"><a href="contactus.html">Contact Us</a></li>
</ul>
</div>
</div>
</nav>
</header>
<div class="container" style="background-color:#fff;">
<div class="row">
<div class="col-lg-12">
<h3>Contact Us</h3>
<div class="col-lg-7 well">
<form enctype="multipart/form-data" method="post" name="contactform" id="former" action="contact.php">
<h4 style="padding-top:8px;">Your email address will not be published. Required fields are marked *</h4>
<label>Name*</label><br>
<input class="form-control" style="height:35px;width:230px;border-radius:4px;"type="text" name="text"/><br>
<label>Phone*</label><br>
<span>
<input id="element_4_1" name="element_4_1" class="element text" size="3" maxlength="3" value="" type="text"> -
</span>
<span>
<input id="element_4_2" name="element_4_2" class="element text" size="4" maxlength="4" value="" type="text"> -
</span>
<span>
<input id="element_4_3" name="element_4_3" class="element text" size="10" maxlength="10" value="" type="text">
</span>
<br><br>
<label>Email*</label><br>
<input class="form-control" style="height:35px;width:230px;border-radius:4px;"type="email" name="text"/><br>
<label for="input4">Message</label>
<textarea name="contact_message" class="form-control" rows="4" id="input4"></textarea>
<p> </p>
<button type="submit" style="margin-left:65px;"class="btn btn-large btn-info">Submit</button>
</form>
</div>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="js/bootstrap.js"></script>
</body>
</html> 下面的是contact.php的代码，在提交contactus表单时调用它。
<?php
extract($_POST, EXTR_OVERWRITE);
$name=chop($name);
$phone=chop($element_4_1);
$phone.=chop($element_4_2);
$phone.=chop($element_4_3);
$email=chop($text);
$message1=chop($contact_message);
if ($name && $phone && $email) {
$headers = "MIME-Version: 1.0\r\n";
$headers .= "Content-type: text/plain; charset=iso-8859-1\r\n";
$headers .= "From: auto-reply\n";
$recipient= "test@gmail.com";
$subject="Online Enquiry";
$message.="\nName : $name\n";
$message.="\nPhone : $phone\n";
$message.="\nEmail ID : $email\n";
$message.="\nMessage : $message1\n";
//send auto-reply
$subject_reply="Thank you";
$message_reply="Thank you for contacting us.";
mail($email, $subject_reply, $message_reply, $headers);
//Send Mail
//===========
if(mail($recipient, $subject, $message, $headers)) {
echo "<meta http-equiv='REFRESH' content='0;url=contactus.html'>";
}
}
else {
exit("You have not filled out all the required fields. Please hit your back button and fill out all the required fields.");
}
?>以上代码运行良好。现在，当我提交表单而没有填充所需的字段时，我在另一个页面中提交表单后得到了错误，我希望以这样一种方式验证所需的字段，如果这些字段未被填充，则错误必须显示在所需的文本字段下面。假设名称未填写，则错误名称应在文本字段后显示。我该怎么做呢。
回答 3
Stack Overflow用户
发布于 2014-01-29 05:56:46
您可以为所有字段添加if条件，只有在验证失败时才能从该字段返回。
你可以试试这个，
if($name == '') {
$msg = 'Name is manadatory';
//create and append div
return false;
}在if中动态创建一个div，给它$msg变量的值，然后在您的字段后面追加该div。
Stack Overflow用户
发布于 2014-01-29 05:44:31
我觉得很难看清你的全部密码。因为你在css中添加了所有的东西。请按照以下URL创建具有验证功能的表单
form.php
请按照步骤并改进您的代码。
Stack Overflow用户
发布于 2014-01-29 05:53:44
您可以引用AJAX，AJAX是服务器端脚本，在Ajax中创建函数并将其重定向到PHP文件。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21422984
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号