在下拉表单上显示表单错误

时间:2013-07-20 19:17:13

标签: php ajax forms validation error-handling

我的标题可能听起来很奇怪,所以我会在这里尝试更好地解释它。

我有一个访问该页面时隐藏的登录表单。它位于右上角,作为一个小的下拉形式。这是没有Jquery的代码,因为我认为我的问题不需要它:

<!DOCTYPE html>
<?php
include "core/init.php";

?>
<html>
    <head>
        <title>Swimstats</title>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="css/style.css">
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    </head>
    <body>
        <header>
            <div id="border"></div>
            <div id="login">
                <div id="userName" class="toggleOff">
                    <?php
                    if(logged_in() === true){
                         echo '<p>Welcome ' . $_SESSION['userID'] . '</p>';
                    } else {
                    ?>
                    <p>Have an account? <span id="test">Sign in here!</span></p>
                    <?php } ?>
                </div>
                <div id="login-content">
                    <form class="clearfix" action="checkuser.php" method="post">
                        <label class="grey" for="email">Email:</label>
                        <input class="field" type="text" name="email" id="email" size="23" />

                        <label class="grey" for="password">Password:</label>
                        <input class="field" type="password" name="password" id="password" size="23" />

                        <div class="clear"></div>

                        <input type="submit" name="submit" value="Login" class="bt_login" />
                    </form>
                </div>
            </div>
        </header>
        <script type="text/javascript" src="js/scripts.js"></script>
    </body>
</html>

这是一个简单的下拉表单,但每当用户填写错误的凭据或留下空白或我需要在表单或上面显示错误时,无关紧要。我有以下代码来捕获错误:

<?php

include "core/init.php";

    if(empty($_POST) === false){
    $email = $_POST['email'];
    $password = $_POST['password'];

    if(empty($email) === true || empty($password) === true){
        $errors[] = 'You need to enter your email and password.';
    } else if(user_exists($email) === false){
        $errors[] = 'Unable to find that email.';
    } else {
        $login = login($email, $password);
        if($login === false){
            $errors[] = 'Email/password combination is incorrect!';
        } else {
            $_SESSION['userID'] = $login;
                header('Location: index.php');
            exit();
        }
    }
    }

?>

但是这个方法只会把我带到checkuser.php页面并向我显示错误,而我必须在表单上显示错误,但我真的不知道如何得到它。

1 个答案:

答案 0 :(得分:0)

好的,找到了解决方案:

这是我的Jquery部分:

$(document).ready(function(){

    $(".bt_login").click(function(){
        email = $("#email").val();
        password = $("#password").val();
        if(email == '' || password == ''){
            $(".errors").html("Please fill in both fields!");
            return false;
        }
        $.ajax({
            type: "POST",
            url: "checkuser.php",
            data: "email=" + email + "&password=" + password,
            success: function(html){
                if(html == 'true'){
                    window.location = "index.php";
                } else {
                    $(".errors").html("Wrong username or password!");
                }
            }
        });
        return false;
    });
});

和我的checkuser.php:

<?php

include "core/init.php";

$email = $_POST['email'];
$password = md5($_POST['password']);

$query = "SELECT * FROM user WHERE email = '$email' AND password = '$password'";
$result = mysql_query($query)or die(mysql_error());
$num_row = mysql_num_rows($result);
$row=mysql_fetch_array($result);

if( $num_row >=1 ) {
    echo 'true';
$_SESSION['userID']=$row['userID'];
$_SESSION['last_name']=$row['last_name'];
$_SESSION['first_name']=$row['first_name'];
}
else{
echo 'false';
}

?>

虽然它可能不是最安全的解决方案,但现在可以使用:)稍后会尝试构建更高的安全性。