验证表单,检查用户是否存在,注册它们。全部使用Ajax

时间:2014-12-14 08:35:56

标签: javascript php jquery ajax if-statement

我的javascript在一个名为register.html的html文件中。 用户提交表单。然后应该触发$('input[name="createacc"]').click(function (e) AJAX然后将这4个变量发送到checkuser.php。 Checkuser.php然后应检查用户名是否存在。如果它确实存在,它应该回显0.如果它不存在,它应该回显1. Register.html然后检查以查看checkuser.php回显的内容。如果回显为“0”,那么应该出现一个警告框,说明用户名不可用。如果echo是“1”或其他任何东西,register.html应该运行$("#registerform").submit();然后执行php脚本。这一切都应该在不离开register.html页面的情况下发生。

我检查了chrome的内置调试器,我看到如果帐户存在,checkuser.php写回0,如果帐户没有,则回写1.但由于某种原因,没有其他事情发生。该帐户未注册,也未显示用户名不可用的提示框

这是我的register.html

<form ata-parsley-validate name="registerform" id="registerform" action="register.php" method="post">

                        <p>
                            <label for="firstname">First Name:</label>
                            <input name="firstname" id="firstname" maxlength="32" type="text" placeholder="Optional" />
                        </p>
                        <p>
                            <label for="username" id="usernameText">Username:</label>
                            <input data-parsley-pattern="^[A-Za-z0-9_]{3,15}$" data-parsley-length="[3, 15]" name="username" id="username" maxlength="32" type="text" data-parsley-error-message="Username needs to be between 3 and 15 characters. Case sensitive. No special characters allowed." required/>
                        </p>
                        <p>
                            <label for="password1">Password:</label>
                            <input name="password1" id="password1" data-parsley-pattern="^[A-Za-z0-9_-]{5,25}$" data-parsley-length="[5, 25]" type="password" data-parsley-equalto="#password2" data-parsley-error-message="Passwords must match. Needs to be between 5 and 25 characters. Case sensitive. No special characters allowed." required/>
                        </p>
                        <p>
                            <label for="password2">Confirm Your Password:</label>
                            <input name="password2" id="password2" data-parsley-length="[5, 25]" data-parsley-error-message="Passwords must match. Needs to be between 5 and 25 characters. Case sensitive. No special characters allowed." data-parsley-pattern="^[A-Za-z0-9_-]{5,25}$" type="password" data-parsley-equalto="#password1" required/>
                        </p>
                        <p>
                            <label for="email">E-Mail:</label>
                            <input data-parsley-trigger="change" name="email" id="email" maxlength="1024" type="email" required/>
                        </p>
                        <p>
                            <input type="submit" id="submit" class="submit" name="createacc" value="Register" />
                        </p>
                    </form>

这是我的javascript

<script>
    $(document).ready(function () {


    $('input[name="createacc"]').click(function (e) {
        var username = $('input[name="username"]').val();
        var firstname = $('input[name="firstname"]').val();
        var password1 = $('input[name="password1"]').val();
        var email = $('input[name="email"]').val();
        e.preventDefault();
       $.ajax({
            type: 'POST',
            data: {
                username: username,
                firstname: firstname,
                password1: password1,
                email: email
            },
            url: 'checkuser.php',
            success: function (data) { //Receives the data from the php code
                if (data === "0") {
                    alert("Username Unavailable");
                } else {
                   $("#registerform").submit();
                alert("Account successfuly created"); 
                }


            },
            error: function (xhr, err) {
                console.log("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
                console.log("responseText: " + xhr.responseText);
            }
        });
    });

        });
</script>

更新 - 我已经通过我下面的其他人的帮助修复了我的代码部分。我现在唯一的问题是$("#registerform").submit();没有做任何事情

2 个答案:

答案 0 :(得分:1)

您正在尝试返回并且JSON未设置

header('Content-type: application/json');

决定是否要传递明文或json。您的字符串现在可能是&#34; 0&#34; ,而不是 0

尝试

if (data === '"0"') {

答案 1 :(得分:0)

我认为问题在于你的成功。你写的如果它确实存在,它应该回显0.如果它不存在,它应该回应1.你应该使用:

success: function (data) { //Receives the data from the php code
                if (data == '"0"') {       //register if user exists.          
                $("#registerform").submit();
                } else {
                      alert("Username Unavailable");
                }