Ajax不向PHP发送数据

时间:2017-05-26 22:15:27

标签: javascript php ajax

我是ajax的新手,我很困惑因为我觉得我的ajax文件没有发送数据到php文件或者php没有得到它,IDK,请帮帮我

这是表格

<form id="register-form" method="post" role="form" style="display: none;">
                                            <div class="form-group">
                                                <input type="text" name="username" id="username" tabindex="1" class="form-control" placeholder="Username" value="">
                                            </div>
                                            <div class="form-group">
                                                <input type="text" name="email" id="email" tabindex="1" class="form-control" placeholder="Email Address" value="">
                                            </div>
                                            <div class="form-group">
                                                <input type="password" name="password" id="password" tabindex="2" class="form-control" placeholder="Password">
                                            </div>
                                            <div class="form-group">
                                                <input type="password" name="confirm-password" id="confirm-password" tabindex="2" class="form-control" placeholder="Confirm Password">
                                            </div>
                                            <div class="form-group">
                                                <div class="row">
                                                    <div class="col-sm-6 col-sm-offset-3">
                                                        <input type="submit" name="register-submit" id="register-submit" tabindex="4" class="form-control btn btn-register" value="Register Now">
                                                    </div>
                                                </div>
                                            </div>
                                        </form>

这是.js

$(document).ready(function(){
$("#register-submit").click(function(){
    var email = $("#email").val();
    var username = $("username").val();
    var password = $("password").val();

    $.ajax({
        type: "POST",
        url: "register.php",
        data:  "email="+email+"&username="+username+"&password="+password,

        success:function(data){
           alert("succes");
        }
    });
});

});

这是.php

<?php
require_once("functions.php");

    $email = $_POST["email"];
    $username $_POST["username"];
    $password $_POST["username"];
    mysqli_query($connection, "INSERT INTO users(email, username, password) VALUES('$email', '$username', '$password')");?>

4 个答案:

答案 0 :(得分:2)

首先:

var username = $("username").val();
var password = $("password").val();

应该是:

var username = $("#username").val();
var password = $("#password").val();


data:  "email="+email+"&username="+username+"&password="+password

应该是:

data:  {email: email, "username": username, password: password}

$username $_POST["username"];
$password $_POST["username"];

应该是:

$username = $_POST["username"];
$password = $_POST["password"];

答案 1 :(得分:0)

1st:您可以使用submit input

,而不是使用form submit event点击事件
$("#register-form").on('submit',function(){

当你使用提交确定你需要阻止页面默认重新加载..我认为你的问题就是这一点..所以你需要使用e.preventDefault();来阻止表单你可以像使用它一样使用它/ p>

$("#register-form").on('submit',function(e){
   e.preventDefault();
   // rest of code here

答案 2 :(得分:0)

您必须以JSON格式发送数据,如:

var data = { "email": email, "username": username, "password": password };

所以在数据Ajax函数中传递数据var!

答案 3 :(得分:0)

$(document).ready(function(){
 $("#submit").click(function(event) {
    event.preventDefault();

    var inputEmail = $("#email").val();
    var inputUsername = $("#username").val();
    var inputPassword = $("#password").val();

    $.ajax({
            type: "POST",
            url: "register.php",
            data: ({ email: inputEmail, password: inputPassword, username: inputUsername}),
            success: function(data){
                var obj = jQuery.parseJSON(data);

                alert("Success " + obj.username + " " + obj.password + " "+ obj.email);
            }
    });


});

});

在.js文件中,我放在.click(function(event) { event.preventDefault(); }

的顶部
preventDefault(); 

此功能可在您按下提交按钮

时阻止页面进行实时编码
data: ({ email: inputEmail, password: inputPassword, username: inputUsername})

我在这里发送数据data: ({nameOfTheVarieableYouWantToReadWithPHP: nameOfTheVariableFromJs})

这是.php文件

require_once("database.php"); //require the connection to dabase

$email = protect($_POST['email']);        //This will read the variables
$username = protect($_POST['username']);  //sent from the .js file
$password = protect($_POST['password']);  //

$result = array();  //This variable will be sent back to .js file
//check if the variables are emtpy
if(!empty($email) && !empty($username) && !empty($password)){
   //db_query is my function from database.php but you can use mysqli_query($connectionVariable, $sqlString);
   db_query("INSERT INTO users (email, username, password) VALUES ('$email','$username','$password')"); //Here insert data to database 
//we will set array variables
$result['username'] = $username;    //Here we set the username variable fron the array to username variable from js
$result['password'] = $password; // the password same as the username
$result['email'] = $email; //the email same as the username and password
}else{ // if the variables are empty set the array to this string
     $result = "bad";
}
echo json_encode($result);  //transform the result variable to json

在.js文件中

       success: function(data){
            var obj = jQuery.parseJSON(data); //create a variable and parse the json from the php file
            //You can set the variables get from the json 
            var usernameFromPhp = obj.username;
            var passwordFromPhp = obj.password;
            var emailFromPhp = obj.email;

            alert("Success " + usernameFromPhp + " " + passwordFromPhp + " "+ emailFromPhp);//
        }