AJAX請求始終返回false

Question

實際上，我正在用一些AJAX做一個簡單的php表單。 我試圖自己解決錯誤，但無法弄清我所缺少的內容。

結果始終為假，數據庫中也沒有記錄

表格 ：

<form id="signUpForm" action="" method="POST"></div>
  <div><input type="text" name="lastname" placeholder="lastname"></div>
  <div><input type="text" name="firstname" placeholder="firstname"></div>
  <div><input type="text" name="pseudoUp" placeholder="pseudo"></div>
  <div><input type="password" name="passwordUp" placeholder="password"></div>
  <div><input type="submit" name="signUpForm" value="signup"></div>
  <div class="signUpMsg"></div>
</form>

PHP腳本：

config.php：

<?php

session_start();

  define('MYSQL_HOST', 'localhost');
  define('MYSQL_USER', ' ');
  define('MYSQL_PASSWD', ' ');
  define('MYSQL_DB', 'php');

  try {
    $PDO = new PDO('mysql:host=' . MYSQL_HOST . ';dbname=' . MYSQL_DB, MYSQL_USER, MYSQL_PASSWD);
    $PDO->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING);
    $PDO->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE, PDO::FETCH_OBJ);
  } catch (PDOException $e) {
    $e->getMessage();
  }

?>

signUp.php：

<?php

  require_once 'config.php';

  if($_POST["lastname"] != "" && $_POST["firstname"] != "" && $_POST["pseudo"] != ""  && $_POST["password"] != ""){
    $req = $PDO->prepare("INSERT INTO users (lastname, firstname, pseudo, password) VALUES(:lastname, :firstname, :pseudo, :password)");
    $req->bindValue(':lastname', $_POST["lastname"]);
    $req->bindValue(':firstname', $_POST["firstname"]);
    $req->bindValue(':pseudo', $_POST["pseudo"]);
    $req->bindValue(':password', sha1($_POST["password"]));
    if ($req->execute()){
      echo 1;
    }else{
      echo 2;
    }
  }

?>

最后，AJAX：

$(function(){
  $('#signUpForm').on('submit', function(e){
    e.preventDefault();

    // Undo mistake, thank to @apokryfos
    data = {
        lastname : $("input[name='lastname']").val(),
        firstname : $("input[name='firstname']").val(),
        pseudo : $("input[name='pseudo']").val(),
        password : $("input[name='password']").val(),
    }

    $.ajax({
      method : "POST",
      url : "php/signUp.php",
      data : data,
      success : function(res){
        if(res == 1){
          $('.signUpMsg').html('Sign up done !');
        }else{
          $('.signUpMsg').html('Sign up fail');
        }
      }
    })
  })
})

感謝閱讀！

編輯：

該錯誤來自錯誤的獲取數據的方式（在輸入中沒有ID，同時檢查AJAX中的輸入ID）和同一頁面中的輸入名稱沖突。 另外，正如Apokryfos所說，我將signIn.php中的'echo true / false'更改為'echo 1/2'。

謝謝您幫忙 ！！

Answer 1

您以錯誤的方式構建發布數據， #something表示ID為 something的DOM元素。 您需要使用輸入name屬性：

data = {
  lastname : $("input[name='lastname']").val(),
  firstname : $("input[name='firstname']").val(),
  pseudo : $("input[name='pseudo']").val(),
  password : $("input[name='password']").val(),
}

我還將建議其他一些內容。 使用HTTP代碼而不是返回數字（這就是代碼的用途，並且它們被普遍理解）：

if($_POST["lastname"] != "" && $_POST["firstname"] != "" && $_POST["pseudo"] != ""  && $_POST["password"] != ""){
    $req = $PDO->prepare("INSERT INTO users (lastname, firstname, pseudo, password) VALUES(:lastname, :firstname, :pseudo, :password)");
    $req->bindValue(':lastname', $_POST["lastname"]);
    $req->bindValue(':firstname', $_POST["firstname"]);
    $req->bindValue(':pseudo', $_POST["pseudo"]);
    $req->bindValue(':password', sha1($_POST["password"]));
    if ($req->execute()){
      echo 1;
    }else{
      http_response_code(500); //server error
      echo 2;
    }
  }
  http_response_code(400); //Client error (didn't send the correct fields)

還有JavaScript

$.ajax({
  method : "POST",
  url : "php/signUp.php",
  data : data,
  success : function(res){
      $('.signUpMsg').html('Sign up done !'); //Only runs this when successful
  },
  error: function (xhr, textStatus) {
      if (xhr.status == 500) { 
         $('.signUpMsg').html('Sign up fail');
      } else if (xhr.status == 400) {
         $('.signUpMsg').html('Please fill the form properly');
      }
  }
})

Answer 2

在ajax部分，您正在使用這樣的輸入ID

data = {
      lastname : $('#lastname').val(),
      firstname : $('#firstname').val(),
      pseudo : $('#pseudo').val(),
      password : $('#password').val(),
    }

但在輸入中沒有輸入的id

<div><input type="text" name="lastname" placeholder="lastname"></div>
  <div><input type="text" name="firstname" placeholder="firstname"></div>
  <div><input type="text" name="pseudo" placeholder="pseudo"></div>
  <div><input type="password" name="password" placeholder="password"></div>