Question

例如，如果未填写用户名，则会向用户发出错误说明，但在按下提交后，他们会被抛到另一个页面并显示错误。

如何将错误保存在与注册表单相同的页面上并保留用户在提交后输入的所有文本？

注册PHP：

<?php
require 'db_connect.php';
$count = 0;
	if (isset($_POST['username']))
    {
	    $username = $_POST['username'];
	    if (!empty($username)) 
	    {
		    $count++;
	    } 
	    else 
	    {
		    echo 'Please enter a username';
		    echo "<br>";
	    }
    }
    if (isset($_POST['email']))
    {
	    $email = $_POST['email'];
	        if (!empty($email))
	        {
		        $count++;
	        } 
	        else 
	        {
		        echo 'Please enter an email';
		        echo "<br>";
	        }
    }
    if (isset($_POST['password']))
    {
	    $password = $_POST['password'];
	        if (!empty($password))
	        {
		        $count++;
	        } 
	        else 
	        {
		        echo 'Please enter a password';
		        echo "<br>";
	        }
    }




if(strlen($username) > 25)
    header('Location: registration.php');

$hashword = password_hash($password,PASSWORD_DEFAULT);

if($count == 3 )
{
    $query = "INSERT INTO member ( username, password, email)
    VALUES ( '$username', '$hashword', '$email');"; 
    header('Location: login.html');
}
else {
        echo '<b>You will be redirected shortly</b>';
        echo "<br>";
        echo '<b>Please enter ALL details correctly</b>';
        header( "refresh:5;url=registration.php" );
}


$result = mysqli_query($connection, $query) or die(mysqli_error($connection));
?>

报名表：

<!doctype html>
<html lang="en">
<head>
    <title>Gumby template file</title>
    <meta charset="utf-8" />
    <script data-touch="gumby/js/libs" src="gumby/js/libs/gumby.min.js"></script>
    <script src="gumby/js/libs/jquery-2.0.2.min.js"></script>
    <link rel="stylesheet" href="gumby/css/gumby.css">
    <script src="gumby/js/libs/modernizr-2.6.2.min.js"></script>
    <link rel="stylesheet" href="forumhomepage_style.css">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
</head>


<body>
    <form name="register" action="register.php" method="post">
        
    	<tr>
			<td>Username: </td>
			<td><input type="text" name="username" maxlength="25" /></td>
		</tr>
		
		<tr>
			<td>Email: </td>
			<td><input type="text" name="email" id="email" /></td>
		</tr>
		
		<tr>
			<td>Password: </td>
			<td><input type="password" name="password" /></td>
		</tr>

		<tr>
			<td>&nbsp;</td>
			<td><input type="submit" value="Register" /></td>
		</tr>
		
	</table>
</form>
    </body>
    </html>

Answer 1

这取决于你想在什么级别做这个。

在发送表单数据之前，可以通过javascript验证不同数据不为空并且信息有意义（如密码长度至少为7个字符），这样您就可以停止发送表单了。您可以使用jQuery Plugin Validator来帮助您完成此操作。

但是其他验证如插入失败只能在服务器端完成，如果你在这种情况下也不需要重定向那么你必须使用ajax加载数据然后刷新网站信息而不用重装。

我更喜欢只使用javascript进行初步检查并将用户发送到结果页面。但我也将这些验证保留为php中的密码长度之一，因为即使现在很多天它真的很奇怪，用户也可以禁用javascript，而且在检查数据库值时我没有惊喜。但是，另一个例子，如果你有很多用户，你可以检查用户不存在，以便在发送表单之前的第一时间警告用户，这只能执行ajax调用。

您应该知道如何做这两件事，并根据您对项目的要求做出决定。

在你的情况下，我会保留现在的PHP验证，如果检测到错误，则在form submit event调用event.preventDefault（）的javascript中检查相同的（非空值）。

$('form[name="register"]').submit(function( event ) {
    if ($('input[name="username"]').is(":empty")) {
        // append a "Username can not be empty message somewhere on your page
        event.preventDefault();
    }
    // I let you finish the jquery code...
});

此示例使用jQuery lib。但是你可以在没有它的情况下只使用javascript来实现它。

Answer 2

有几种方法可以做到这一点。第一步是在输入元素中使用 required 属性：

<input type="text" name="username" required>

这将强制用户至少在输入元素中放置一些内容。然后是用于客户端验证的Javascript或jQuery。您可以创建一个自定义事件处理程序来捕获表单提交并验证输入，如下所示：

document.getElementById("your_form_id_here").addEventListener("submit", function(e){
    // Your Javascript validation code here, for example:
    var x = document.forms["your_form_id_here"]["username"].value;
    if (x == "") {
        alert("Username must be filled out");
        e.preventDefault();
    }
});

您还可以将表单处理程序放在与表单相同的文件上，并在出现错误时显示错误/值。例如：

<?php

if(!empty($_POST['submit'])){
    $error = false;

    if($_POST['username'] === ''){
        $usernameEmpty = 'The username was empty. Please enter a username!';
        $error = true;
    }

    if(!$error){
        // No errors found so proceed with the registration
    }
}

?>

<form id="myForm" method="post" action="" accept-charset="utf-8">
    <?php if(!empty($usernameEmpty)){ echo $usernameEmpty . '<br/>'; } ?>
    Username: <input type="text" name="username" value="<?php if(!empty($_POST['username'])){ echo $_POST['username']; } ?>"/>
    <input type="submit" name="submit" value="Register"/>
</form>

最后，当然Ajax允许您将表单发送到PHP而无需重新加载页面。你可以让PHP发回错误并使用Javascript来显示DOM内的错误。

Answer 3

没有ajax，您需要使用一些条件逻辑来引导您的页面。这将查看是否填写了任何字段并再次填写，并设置任何错误消息以返回给用户。

类似的东西：

<?php
  //example fields
  $username = '';
  $field2 = '';
  $field3 = '';
  if(isset($errorToShow)){
    // echo your error message here
  }
  if($_POST["submit"]){
    foreach($_POST as $k=>$v){
      $$k = $v;
    }
  }

  // your form can be here.

当然还有其他注意事项，而ajax是一个更好的解决方案，但这类事情可以正常工作。

Answer 4

您可以使用ajax 或者，如果您不知道ajax

您可以将所有代码放在一个页面中，并将$_POST索引调用到每个输入的value。

代表。

<input type="text" name="username" maxlength="25" value="<?=$_POST['usename'];?>"/>

或者您可以使用"PHP $_SESSION"

只需将$_POST存储到$_SESSION 然后从html页面调用它

代表

<input type="text" name="username" maxlength="25" value="<?=$_SESSION['usename'];?>"/>

同样的错误观念。

在不重定向到另一个页面的情况下回显错误并保留所有表单数据？

4 个答案: