Jquery在使用PHP AJAX编写的注册页面中提示错误

时间:2015-09-23 12:50:20

标签: javascript php jquery html ajax

我正在使用PHP,AJAX和Jquery创建一个“注册”表单,它可以在不刷新页面的情况下提交值。不知怎的,我提出了代码,但它无法正常工作。我无法理解为什么会出现这个错误。请帮帮我。

这是我的index.php页面

<form class="form-horizontal" action="" method="post">

            <div class="control-group">
                <label for="name" class="control-label">
                    <span>Full Name</span> <span class="required">*</span>
                </label>
                <div class="controls">
                    <input type="text" name="name" id="name" required placeholder="Full name">
                </div>
            </div>

            <div class="control-group">
                <label for="username" class="control-label">
                    <span>Username</span> <span class="required">*</span>
                </label>
                <div class="controls">
                    <input type="text" name="username" id="username" required placeholder="username">
                </div>
            </div>

            <div class="control-group">
                <label for="password" class="control-label">
                    <span>Password</span> <span class="required">*</span>
                </label>
                <div class="controls">
                    <input type="password" name="password" id="password" required placeholder="Password">
                </div>
            </div>

            <div class="control-group">
                <label for="password2" class="control-label">
                    <span>Repeat password</span> <span class="required">*</span>
                </label>
                <div class="controls">
                    <input type="password" name="password2" id="password2" required placeholder="Repeat Password">
                </div>
            </div>

            <div class="control-group">
                <label for="email" class="control-label">
                    <span>Email</span> <span class="required">*</span>
                </label>
                <div class="controls">  
                    <input type="email" name="email" id="email" required placeholder="Email Address">
                </div>
            </div>

            <div class="controls">
                <input class="btn btn-primary" id="submit" type="submit" value="Sign Up!">
            </div>

        </form>

这是与index.php

附加的scripts.js文件
$(function(){
var form    = $('form');
var submit  = $('#submit');
var alert   = $('.alert');
form.validate({
    rules: {
        name: {
            required: true,
            minlength: 3
        },
        username: {
            required: true,
            minlength: 3,
            maxlength: 8,
        },
        password: {
            required: true,
            minlength: 6,
            maxlength: 16
        },
        password2: {
            equalTo: '#password'
        },
        email: 'required'
    },
    submitHandler: ajaxSubmit
});
function ajaxSubmit() {
    $.ajax({
        url: 'ajax.php',
        type: 'POST',
        dataType: 'json',
        data: form.serialize(),
        beforeSend: function(){
            alert.fadeOut();
            submit.val('Sending...').attr('disabled', 'disabled');
        },
        success: function(data){
            if ( data.status === 'success' ) {
                $(location).attr('href','success.html');
            } else {
                alert.html(data.status).fadeIn();
                submit.val('Sign Up').removeAttr('disabled');
            }
        },
        error: function(){

            alert.html('Sending request fail').fadeIn();
            submit.val('Sign Up').removeAttr('disabled');
        }
    });
};
});

这是我的ajax.php页面

    <?php
include 'config.php';
include 'function.php';
# mysql db connect
dbConnect();
header('Content-type: application/json');
if ( $_SERVER['REQUEST_METHOD'] === 'POST' )
{
    if ($_POST['name'] !== '' and $_POST['username'] !== '' and $_POST['password'] !== '' and $_POST['email'] !== '' )
    {
        if ($_POST['password'] === $_POST['password2']) {
            # prevent sql injection
            $name       = mysql_real_escape_string($_POST['name']);
            $username   = mysql_real_escape_string($_POST['username']);
            $password   = mysql_real_escape_string($_POST['password']);
            $email      = mysql_real_escape_string($_POST['email']);
            # username exist or not
            if (!user_exist($username))
                {   # insert new user
                    if (inser_new_user($name, $username, md5($password), $email))
                    {   # throw success status
                        json_status('success');
                    # throw errors
                    } else { json_status('Request not complete'); }
                } else { json_status('Username already exist'); }
            } else { json_status('Passwords are not matched'); }
        } else { json_status('You must complete all the fields'); }
    }
    ?>

这是ajax.php中包含的function.php

<?php
 function dbConnect($close=true)
 {
if (!$close) 
{
    mysqli_close($link);
    return true;
}
$link = mysqli_connect(DB_HOST, DB_USER, DB_PASS, MYSQL_DB) or die('Could   not connect to MySQL DB ');
}
function user_exist($username)
{
    $query = mysqli_query($link,
        "SELECT *
        FROM admin
        WHERE username = '{$username}'");
    if (mysqli_num_rows($query) > 0)
        return true;
}
function inser_new_user($name, $username, $password, $email)
{
    $query =
    "INSERT INTO admin
    (name, username, password, email)
    VALUES ( '{$name}', '{$username}', '{$password}', '{$email}' )";
    if (mysqli_query($link, $query))
        return true;
}
function json_status($status)
{
    echo json_encode(array('status' => $status));
}
?>

配置文件包含数据库变量,这些变量是正确的,而且很少有success.html页面具有小代码

<html>
<head>
<title>Success!</title>
</head>
<body>
<h1>Sign up successful!</h1>
</body>
</html>

所以这是我完成的完整代码,它显示的主要错误是

“发送请求失败”

,它位于script.js中。请帮我解决这个问题。建议我解决方案。我将非常感激。

0 个答案:

没有答案