0

私のサイトに非常に基本的なログインシステムを実装するための以下のコードがあります(jQuery Mobileを使用)。問題は、jQuery Mobileを介して(したがってバリデーターを使用して)フォームを送信すると、パスワードが正しい場合でも、バリデーターは常にfalseを返し、エラーをスローすることです。2つのテキストボックスと送信ボタンだけで別のフォームを作成し、それを検証スクリプトに直接実行すると、指定されたパスワードに応じてtrueまたはfalseの正しい値が返されました。常にfalseを返すjQueryスクリプトの何が問題になっていますか?

HTML / JS:

<form action="logins.php" method="POST" id="loginForm" name="loginForm" data-ajax="false">
<label for="email" class="ui-hidden-accessible">Email Address:</label>
<input type="text" id="email" name="email" value="" placeholder="Email Address" />
<label for="pass" class="ui-hidden-accessible">Password:</label>
<input type="password" id="pass" name="pass" value="" placeholder="Password" />
<input class="submit" data-role="submit" type="submit" value="Submit" />
</form><br>
<br>
<a href="#index" data-role="button" data-transition="slide" data-direction="reverse">Return to home page</a>
<script>
    $('#login').bind('pageinit', function(event) {
        $('#loginForm').validate({
            onkeyup: false,
            onclick: false,
            onfocusout: false,
            rules: {
                email: {
                    required: true,
                    email: true
                },
                pass: {
                    required: true,
                    remote: {
                        url: "passcheck.php",
                        type: "post"
                    }
                }
            },
            messages: {
                email: {
                    required: "You must enter an email address.",
                    email: "You must enter a valid email address."
                },
                pass: {
                    required: "You must enter a password.",
                    remote: "Your username/password combination is incorrect."
                }
            }
        });
    });
</script>

PHP(passcheck.php):

<?php
    require("common.php");

$query = "SELECT password FROM users WHERE email = :email";
$query_params = array(':email' => $_POST['email']);

try { 
    $stmt = $conn->prepare($query); 
    $stmt->execute($query_params);
} catch(PDOException $ex) { 
    die("Failed to run query."); 
}

$hash = $stmt->fetchColumn();

if(crypt($_POST['pass'], $hash) === $hash){
    echo "true";
} else {
    echo "false";
}
4

1 に答える 1

0

submitHandlerを使用して、AJAXフォームを使用したAJAX経由のユーザー名/パスワードの実際のチェックを処理する関数を作成する必要があります:http://www.malsup.com/jquery/form/#api。AJAX Formを使用する必要はなく、jQuery ajax()メソッドを使用してログインチェックを処理する独自のメソッドを作成できますが、AJAXFormには事前に作成されています。

また、onkeyupやonblurなどは必要ありません。必要なのはonsubmitをtrueに設定することだけです。コードは次のようになります。

<script>
    $('#login').bind('pageinit', function(event) {
        $('#loginForm').ajaxForm(); // Set as an AJAX Form - See Documentation Above
        $('#loginForm').validate({
            onsubmit: true,
            rules: {
                email: {
                    required: true,
                    email: true
                },
                pass: {
                    required: true
                }
            },
            messages: {
                email: {
                    required: "You must enter an email address.",
                    email: "You must enter a valid email address."
                },
                pass: {
                    required: "You must enter a password.",
                }
            },
            submitHandler: function(form) {
                $("#loginForm").ajaxSubmit();
            }
        });
    });
</script>
于 2013-01-10T18:22:32.203 に答える