在同一页面上显示PHP表单验证结果 [英] Display PHP Form Validation Results on Same Page
问题描述
我确定最初的反应会是这样的：这个人没有Google吗？是的，我承认这看起来似乎是一个非常基本的概念，我试图绕过它来考虑问题，查看关于该主题的各种帖子和文章等，但都无济于事。也许你可以指点我正确的方向？
我有一个基本的联系表单（contact.html），我使用外部PHP脚本（contact.php）运行。这里是HTML表单代码：
< form id =form1action =contact.phpmethod =post >
< div class =form1>
< label>您的名称：< / label>
< span>< input type =textname =name/>< / span>
< / div>
< div class =form1>
< label>您的学校：< / label>
< span>< input type =textname =school/>< / span>
< / div>
< div class =form1>
< label>电话号码：< / label>
< span>< input type =textname =phone/>< / span>
< / div>
< div class =form1>
< label>电子邮件地址：< / label>
< span>< input type =textname =email/>< / span>
< / div>
< div class =form3>
< span>< textarea cols =1rows =1name =message>< / textarea>< / span>
< / div>
< div class =wrapper>
< input class =submittype =imagesrc =images / contact_submit.pngname =submitalt =Submit/>
< / div>
< / form>
PHP脚本验证所有字段都已输入，然后处理表单：
<？php
if（$ _SERVER ['REQUEST_METHOD'] =='POST'）{
$ b $ //验证名称：
if（！empty（$ _ POST ['name']））{
$ name = $ _POST ['name'];
} else {
echo你忘了输入你的名字。< br>;
}
//验证学校：
if（！empty（$ _ POST ['school']））{
$ school = $ _POST ['school ];
} else {
echo你忘了进入你的学校了。< br>;
}
//验证电子邮件：
if（！empty（$ _ POST ['email']））{
$ email = $ _POST [ '电子邮件'];
} else {
echo您忘记输入您的电子邮件了。< br>;
}
//验证消息：
if（！empty（$ _ POST ['message']））{
$ message = $ _POST ['message ];
} else {
echo你忘了输入信息。; $ _
$ b if（！empty（$ _ POST ['name']）&&！empty（$ _ POST ['school']）&&！empty（$ _ POST ['email']）&&！empty（$ _ POST ['message']））{
$ phone = $ _POST ['phone'];
$ body =$ name\\\
$ school \ $ $ phone\\\
$ email \\\
\\\
$ message;
邮件（***，PAL网站 - 访客留言，$ body）;
header（Location：confirm.html）;
}
}
？>
一切都很好，表单根据预期进行验证和处理。但是，我真的想要设置它，以便错误消息显示在同一页面上，或者至少使用包含错误消息的刷新形式。
I'在其他示威活动中已经看到了这一点（例如拉里乌尔曼的书），但仍然无法弄清楚如何实现这一点。你能提供建议吗？最简单的方法是什么？
以下是页面网址，如果有帮助： http://www.712jefferson.org/pal/contact.html
谢谢！
我会为此使用jQuery。
修改：
在HTML中：
将id添加到您的输入文件中，因此您可以使用jQuery抓取它们（您可以请参阅下面 $。post 方法中的用法）。
< ; form id =form1action =contact.phpmethod =post>
< div class =form1>
< label>您的名称：< / label>
< span>< input id =nametype =textname =name/>< / span>
< / div>
< div class =form1>
< label>您的学校：< / label>
< span>< input id =schooltype =textname =school/>< / span>
< / div>
< div class =form1>
< label>电话号码：< / label>
< span>< input id =phonetype =textname =phone/>< / span>
< / div>
< div class =form1>
< label>电子邮件地址：< / label>
< span>< input id =emailtype =textname =email/>< / span>
< / div>
< div class =form3>
< span>< textarea id =messagecols =1rows =1name =message>< / textarea>< / span>
< / div>
< div class =wrapper>
< input class =submittype =imagesrc =images / contact_submit.pngname =submitalt =Submit/>
< / div>
< / form>
在PHP中：
如果在验证中没有错误回显：success / p>
if（！empty（$ _ POST ['name']）&&！empty（$ _ POST ['school']] ）&&！empty（$ _ POST ['email']）&&！empty（$ _ POST ['message']））{
echosuccess;
$ phone = $ _POST ['phone'];
$ body =$ name\\\
$ school \ $ $ phone\\\
$ email \\\
\\\
$ message;
邮件（***，PAL网站 - 访客留言，$ body）;
header（Location：confirm.html）;
}
附上 jQuery 库添加到您的站点，并在HTML文件中的括号内或附加到您网站的外部* .js文件中使用下面的代码。
在您的HTML文件的部分使用这个：
< script src =http：//ajax.googleapis。 COM / AJAX /库/ jquery的/ 1.10.2 / jquery.min.js>
< / script>
jQuery脚本：
submit（function（）{
event.preventDefault（）;
$ .post（contact.php，{name：$（ val（），电话：$（＃email）。val（），school：$（＃school）。 ，消息：$（＃message）。val（）}，function（data）{
if（data！=success）{
alert（data）;
}
}）;
}）;
这会在警报窗口中显示您的错误消息，并且如果我没有错。
I'm sure the initial reaction is going to be something like, "Doesn't this guy have Google?" Yes, I'll admit this does seem like a pretty basic concept and I've tried and tried to wrap my head around it, looked up all manner of posts and articles on the topic, etc., but all to no avail. Perhaps you can point me in the right direction?
I have a basic contact form (contact.html) that I run with an external PHP script (contact.php). Here's the HTML form code:
<form id="form1" action="contact.php" method="post">
<div class="form1">
<label>Your Name:</label>
<span><input type="text" name="name" /></span>
</div>
<div class="form1">
<label>Your School:</label>
<span><input type="text" name="school" /></span>
</div>
<div class="form1">
<label>Phone Number:</label>
<span><input type="text" name="phone" /></span>
</div>
<div class="form1">
<label>E-Mail Address:</label>
<span><input type="text" name="email" /></span>
</div>
<div class="form3">
<span><textarea cols="1" rows="1" name="message"></textarea></span>
</div>
<div class="wrapper">
<input class="submit" type="image" src="images/contact_submit.png" name="submit" alt="Submit" />
</div>
</form>
The PHP script validates that all of the fields were entered and then processes the form:
<?php
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
//Validate the name:
if (!empty($_POST['name'])) {
$name = $_POST['name'];
} else {
echo "You forgot to enter your name.<br>";
}
//Validate the school:
if (!empty($_POST['school'])) {
$school = $_POST['school'];
} else {
echo "You forgot to enter your school.<br>";
}
//Validate the e-mail:
if (!empty($_POST['email'])) {
$email = $_POST['email'];
} else {
echo "You forgot to enter your e-mail.<br>";
}
//Validate the message:
if (!empty($_POST['message'])) {
$message = $_POST['message'];
} else {
echo "You forgot to enter a message.";
}
if (!empty($_POST['name']) && !empty($_POST['school']) && !empty($_POST['email']) && !empty($_POST['message'])) {
$phone = $_POST['phone'];
$body = "$name\n$school\n$phone\n$email\n\n$message";
mail("***", "PAL Website - Message from a Visitor", $body);
header("Location: confirm.html");
}
}
?>
Everything works great and the form is validated and processed as intended. However, I REALLY want to set it up so that the error messages are displayed on the same page or at least have the form refreshed with the error messages included.
I've seen this done in other demonstrations (Larry Ullman's book, for example), but still can't quite figure out how to make it happen. Can you please offer advice? What's the simplest way to go about it?
Here's the page URL, if it helps: http://www.712jefferson.org/pal/contact.html
Thank you!
I'd use jQuery for this. Modifications to be made:
in HTML:
add id to your input fileds, so you can "grab" them with jQuery (You can see the usage in the $.post method below).
<form id="form1" action="contact.php" method="post">
<div class="form1">
<label>Your Name:</label>
<span><input id="name" type="text" name="name" /></span>
</div>
<div class="form1">
<label>Your School:</label>
<span><input id="school" type="text" name="school" /></span>
</div>
<div class="form1">
<label>Phone Number:</label>
<span><input id="phone" type="text" name="phone" /></span>
</div>
<div class="form1">
<label>E-Mail Address:</label>
<span><input id="email" type="text" name="email" /></span>
</div>
<div class="form3">
<span><textarea id="message" cols="1" rows="1" name="message"></textarea></span>
</div>
<div class="wrapper">
<input class="submit" type="image" src="images/contact_submit.png" name="submit" alt="Submit" />
</div>
</form>
in PHP: if there is no error in validation echo this: "success"
if (!empty($_POST['name']) && !empty($_POST['school']) && !empty($_POST['email']) && !empty($_POST['message'])) {
echo "success";
$phone = $_POST['phone'];
$body = "$name\n$school\n$phone\n$email\n\n$message";
mail("***", "PAL Website - Message from a Visitor", $body);
header("Location: confirm.html");
}
Attach jQuery library to your site and use the code below in your HTML file inside brackets or in an external *.js file attached to Your site. In Your HTML file's section use this:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
jQuery script:
$('#form1').submit(function() {
event.preventDefault();
$.post("contact.php", {name: $("#name").val(), school: $("#school").val(), phone: $("#phone").val(), email: $("#email").val(), message: $("#message").val()}, function(data){
if(data !="success"){
alert(data);
}
});
});
This will give Your error messages in a alert window and Your site won't reload if I'm not mistaken.
这篇关于在同一页面上显示PHP表单验证结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
