HTML AJAX не выполняется PHP

Question

Я действительно новичок в AJAX / jQuery и PHP, и я пытаюсь работать над небольшим проектом, который записывает ваш ежедневный вес в БД, который затем отображается на графиках et c.

Мне бы хотелось, чтобы, когда пользователь отправлял форму для своего веса, чтобы она отображала всплывающее сообщение, но по какой-то причине скрипт AJAX / Jquery, похоже, ничего не делает с php следовательно, файл не добавляется в базу данных.

Вот форма HTML: (index. html)

      <form id="ajax-form" method="post" action="connection.php">
        <div class="columns field">
          <div class="column control is-half is-offset-one-quarter">
            <input
              class="input"
              id="weight"
              name="weight"
              type="text"
              placeholder="Enter your weight for the day"
            />
          </div>
        </div>

        <div class="center-test">
          <div class="field">
            <div class="control">
              <span class="select">
                <select name="person">
                  <option value="Ayush">Ayush</option>
                  <option value="Sheri">Sheri</option>
                </select>
              </span>
            </div>
          </div>
        </div>

        <input type="date" name="weightdate" id="weightdate" />
        <div class="field column is-half is-offset-one-quarter">
          <button
            type="submit"
            id="submit"
            name="submit"
            class="button is-primary"
          >
            Submit
          </button>
        </div>
      </form>

      <div id="error_message" class="text-danger"></div>
      <div id="success_message" class="text-success"></div>

AJAX / jQuery: (внутри индекса. html)

        $(document).ready(function () {
          $("#submit").click(function (e) {
            e.preventDefault();
            var weight = $("#weight").val();
            var person = $("#person").val(); // You miss this
            var weightdate = $("#weightdate").val(); // You miss this
            if (weight == "" || person == "" || weightdate == "") {
              $("#error_message").html("All Fields are required");
            } else {
              $("#error_message").html("");
              $.ajax({
                url: "connection.php",
                method: "POST",
                data: {
                  weight: weight,
                  person: person, // Add this
                  weightdate: weightdate, // Add this
                },
                success: function (data) {
                  $("form").trigger("reset");
                  $("#success_message").fadeIn().html("data");
                  setTimeout(function () {
                    $("#success_message").fadeOut("Slow");
                  }, 2000);
                },
              });
            }
          });
        });

PHP: (соединение. php)

<?php
error_reporting(E_ALL); ini_set('display_errors', 1);
include_once 'dbconnect/db_info.php';


$weight = $_POST['weight'];
$person = $_POST['person'];
$date = $_POST['weightdate'];
$formatDate = date("d/m/y", strtotime($date));
//echo $formatDate;

if(date("m", strtotime($date)) == date("01")) {
    $sql = "INSERT INTO WeightTracker (person, kg, weight_date, date_month) VALUES ('$person', '$weight', '$formatDate', 'January');";
    #$result = mysqli_query($conn, $sql);
    $result = mysqli_query($conn, $sql);
}
elseif(date("m", strtotime($date)) == date("04")) {
    //echo working;
    $sql = "INSERT INTO WeightTracker (person, kg, weight_date, date_month) VALUES ('$person', '$weight', '$formatDate', 'April');";
    #$result = mysqli_query($conn, $sql);
    $result = mysqli_query($conn, $sql);
}
else {
    $sql = "INSERT INTO WeightTracker (person, kg, weight_date) VALUES ('$person', '$weight', '$date');";
    #$result = mysqli_query($conn, $sql);
    $result = mysqli_query($conn, $sql);
}

У кого-нибудь есть идеи? Когда я удаляю код AJAX / jQuery, форма успешно отправляется, и соединение. php записывает в базу данных без проблем.

Answer 1

Ваша проблема лежит здесь.

include_once 'dbconnect/db_info.php'; 

Измените ее на что-то вроде

realpath('__DIR__'.'/dbconnect/db_info.php');

Надеюсь, это решит вашу проблему.

Answer 2

Большая часть проблемы была решена в комментариях. Проблема (как описано в комментариях) была PHP ошибка Undefined index в этой строке:

$person = $_POST['person'];

Как я уже упоминал в предыдущем комментарии: при вводе вашего лица отсутствует ожидаемый идентификатор человека. Это означает, что Javascript:

var person = $("#person").val();

на самом деле не определено, поэтому поле person, добавленное к вашему PHP, отсутствует, поэтому, когда вы попытаетесь использовать его как $_POST['person'], вы получите ошибку.

Чтобы исправить это, просто добавьте идентификатор, который Javascript использует, чтобы найти человека:

<select name="person" id="person">

Answer 3

Данные, которые вы предоставляете для запроса POST, просто weight, данных person и weightdate нет.

var weight = $("#weight").val();
var person = $("#person").val(); // You miss this
var weightdate = $("#weightdate").val(); // You miss this

if (weight == "" || person == "" || weightdate == "") {
    $("#error_message").html("All Fields are required");
} else {
    // Your code :)
}

И data,

              $.ajax({
                url: "connection.php",
                method: "POST",
                data: {
                    weight: weight,
                    person: person, // Add this
                    weightdate: weightdate // Add this
                },
                success: function(data) {
                  $("form").trigger("reset");
                  $("#success_message")
                    .fadeIn()
                    .html("data");
                  setTimeout(function() {
                    $("#success_message").fadeOut("Slow");
                  }, 2000);
                }
              });