Попытка активировать функцию PHP с помощью нажатия кнопки с AJAX

Question

Я пытаюсь вызвать скрипт / файл PHP, который будет считывать данные из таблицы HTML. Я хочу нажать кнопку, чтобы скрипт / файл PHP активировался и считывал данные из таблицы HTML в базу данных, используя MySQL.

Мой сценарий AJAX не активирует файл PHP.

Код кнопки HTML:

<button type="submit" class="btn btn-md btn-primary btn-block" id="save">Save Workout</button>

Код AJAX:

$(document).ready(function(){
        $("#save").click(function(){
            $.ajax({
                type: 'POST',
                url: 'addWorkoutTEST.php',
                success: function() {
                    alert("hello");
                }
            });
        });
});

Неполный код PHP (не содержит код БД) - на основе https://brennanhm.ca/knowledgebase/2015/11/import-html-table-into-mysql-table/

<?php

require_once ('simple_html_dom.php');

$table = file_get_html('addWorkout.php');

$db = mysqli_connect('localhost', 'root', '', 'workoutLogger');

foreach($table ->find('tr') as $tr) {    
    $exercise = $tr->find('td', 0)->plaintext;
    $weight = $tr->find('td', 1)->plaintext;
    $sets = $tr->find('td', 2)->plaintext;
    $reps = $tr->find('td', 3)->plaintext;

    $exercise_c = mysqli_real_escape_string($db, $exercise);
    $weight_c = mysqli_real_escape_string($db, $weight);
    $sets_c = mysqli_real_escape_string($db, $sets);
    $reps_c = mysqli_real_escape_string($db, $reps);
}
?>

Я не могу получить сообщение об успехе.

Answer 1

Я закончил тем, что держал кнопку и оборачивал ее вокруг формы с помощью действия "addWorkoutTEST.php", и это прекрасно выполнялось.

                <form action="addWorkoutTEST.php">
                    <button type="submit" class="btn btn-md btn-primary btn-block" name="save">Save Workout</button>
                </form>

Answer 2

Чтобы предотвратить действие отправки формы по умолчанию, вам просто нужно добавить в event.preventDefault();

Как то так ...

$(document).ready(function(){
    $("#save").click(function(event){ // must include event here to match the object in the next line. It can be called anything.
        event.preventDefault(); // Prevent Default Submit
        $.ajax({
            type: 'POST',
            url: 'addWorkoutTEST.php',
            success: function() {
                alert("hello");
            },
            error: function (request, status, error) {
                alert("ERROR: " + request.responseText);
            }
        });
    });
});

Если javascript по какой-либо причине отключен, вам необходимо решить, какое действие предпринять. С учетом того, что вы уже нашли в своем ответе на форму с добавленным действием, в таком случае это будет запасной вариант. Это то, что вам нужно продумать и принять решение.

Answer 3

В вашем PHP есть пробел между "$ table" и "-> find ('tr')", что приведет к ошибке в скрипте и приведет к тому, что AJAX вернет ошибку вместо успеха. Чтобы получать отчеты об ошибках и самостоятельно приступать к устранению неполадок, измените AJAX на следующее:

$(document).ready(function(){
        $("#save").click(function(){
            $.ajax({
                type: 'POST',
                url: 'addWorkoutTEST.php',
                success: function() {
                    alert("hello");
                },
                error: function (request, status, error) {
                  alert("ERROR: " + request.responseText);
                }
            });
        });
});