简体   繁体   English

使用PHP进行表单验证时遇到问题

[英]Trouble with form validation using PHP

I have a relatively simple sounding question that hopefully entails a simple answer. 我有一个相对简单的问题,希望能给出一个简单的答案。 I am currently developing a website that is a scroll-down type; 我目前正在开发一个向下滚动的网站; everything is on one page, you know the one. 一切都在一页上,您知道这一页。 My 'contact' section is at the very bottom of the page, and I am of course doing form validation with PHP. 我的“联系”部分位于页面的底部,我当然使用PHP进行表单验证。 The validation part works, I have no trouble with that. 验证部分有效,我对此没有任何问题。 However, if validation fails, the browser takes me back all the way back to the top of the page; 但是,如果验证失败,浏览器会将我带回到页面顶部; this is inconvenient for obvious reasons. 由于明显的原因,这很不方便。

I am aware of the 'header()' function, which I can use to keep me at the bottom of the page if an error occurs. 我知道'header()'函数,如果发生错误,可以使用该函数将我保持在页面底部。 As an example, at the top of my HTML page before the DOCTYPE, I can write: 举例来说,在DOCTYPE之前的HTML页面顶部,我可以编写:

if ($errors) {
header(Location: 'somelocation.php#contact');
}

This works, but for some reason it prevents my PHP embedded in my html to work. 这行得通,但是由于某种原因,它阻止了我嵌入在html中的PHP正常工作。 If some errors occur, I want to display them using PHP on the page: 如果发生一些错误,我想在页面上使用PHP显示它们:

<h2>Contact</h2>
<?php if($errors) { ?>
<p class="warning">Please fix the errors</p>
<?php } ?>

'Please fix the errors' does not appear. 不会出现“请修复错误”。 It does appear however, if I remove the header function from the page, so I know the problem is related. 但是,如果我从页面中删除了标头函数,它确实会出现,所以我知道问题是相关的。 So basically, if I remove the header() function, the page goes back to the top, and the errors show; 因此,基本上,如果我删除header()函数,页面将返回顶部,并显示错误; if I keep the header() function, the page correctly stays where it is, but no errors show. 如果我保留header()函数,则页面可以正确地保留在原处,但不会显示任何错误。

Alternatively, this question also can be asked in the case of, what happens when the form is validated correctly, the 'header' function is called, and I want to stay at the bottom of the page and display some HTML saying 'Thanks, your form has been submitted'? 另外,在以下情况下也可以问这个问题:正确验证表单,调用“ header”函数,我想停留在页面底部并显示一些HTML,表示“谢谢,您的表格已提交'? (I don't want to go to a 'thank-you' page or anything, just stay in the same spot and give a 'thanks' on the page) I assume I'd run into the same problem. (我不想转到“谢谢”页面或其他任何内容,只需停留在同一位置并在页面上给予“谢谢”),我想我也会遇到相同的问题。 Is there a solution to this? 有针对这个的解决方法吗?

Thanks in advance! 提前致谢!

Specifying a location in the header will cause the browser to redirect to that URI. 在标题中指定位置将导致浏览器重定向到该URI。 This is being called before any output is sent to the browser. 在将任何输出发送到浏览器之前,将调用此方法。

When the page is reset, $errors == false , so the paragraph isn't displayed. 重置页面后, $errors == false ,因此不显示该段落。

It sounds like you need to integrate AJAX, or a mixture of server- and client-side code here. 听起来您需要在这里集成AJAX或服务器和客户端代码的混合。

A very simple and efficient way to validation of a form is using jquery, A perfect example of this: 验证表单的一种非常简单有效的方法是使用jquery,这是一个完美的示例:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
 <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
 <style type="text/css">
* { font-family: Verdana; font-size: 96%; }
label { width: 10em; float: left; }
label.error { float: none; color: red; padding-left: .5em; vertical-align: top; }
p { clear: both; }
.submit { margin-left: 12em; }
 em { font-weight: bold; padding-right: 1em; vertical-align: top; }
 </style>
 <script>
  $(document).ready(function(){
    $("#commentForm").validate();
   });
   </script>

 </head>
 <body>


 <form class="cmxform" id="commentForm" method="get" action="">
 <fieldset>
  <legend>A simple comment form with submit validation and default messages</legend>
  <p>
 <label for="cname">Name</label>
 <em>*</em><input id="cname" name="name" size="25" class="required" minlength="2" />
  </p>
  <p>
 <label for="cemail">E-Mail</label>
 <em>*</em><input id="cemail" name="email" size="25"  class="required email" />
  </p>
  <p>
 <label for="curl">URL</label>
 <em>  </em><input id="curl" name="url" size="25"  class="url" value="" />
     </p>
   <p>
 <label for="ccomment">Your comment</label>
 <em>*</em><textarea id="ccomment" name="comment" cols="22"  class="required"></textarea>
  </p>
   <p>
 <input class="submit" type="submit" value="Submit"/>
  </p>
  </fieldset>
  </form>
 </body>
 </html>

Happy Coding.!!! 快乐编码!!!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM