AJAX 查询在 PHP while-loop 中添加/删除错误记录

Question

我正在使用 AJAX 在 while 循环中向我的数据库插入/删除记录，并返回成功消息。我创建了一个 ADD (+) 按钮和一个 REMOVE (-) 按钮。当我单击第一条记录的“添加”按钮时，查询是在表中添加最后一条记录，而不是我实际单击的那条记录。在此示例中，LIMIT 设置为 5，当我尝试插入第一条记录时，它添加了五次第五条记录。显然我只希望它插入我点击过一次的记录。删除时会发生相同类型的行为。此外，其他 4 个按钮不起作用 - 单击这些按钮时，不会显示成功消息，也不会在数据库中插入/删除任何记录。

任何帮助将不胜感激！！！

这里是主要代码

<?php
include "includes/db_connector.php";
$username = 'someone';
?>

<?php $sql_action = "SELECT movies.img, movies.new, movies.title_full, my_list.username FROM movies LEFT JOIN my_list ON movies.title_full = my_list.title WHERE movies.category = 'action' ORDER BY movies.id DESC LIMIT 5";
    $result_action = mysqli_query( $db_connect, $sql_action )or die( mysqli_error( $db_connect ) );
    while ( $row_action = mysqli_fetch_assoc( $result_action ) ) {
      $img = $row_action[ 'img' ];
      $title = $row_action[ 'title_full' ];
      $mylist_username = $row_action[ 'username' ]; ?>
        
<?php if ( $mylist_username == $username) { // IS A FAVORITE ?>

<div id="fav_delete" style="display: inline-block;">
    <form style="display: inline-block;" class="my_list_delete">
        <input id="new_releases" type="image" name="image" src="images/<?php echo $img ?>"><br />
        <input style="display: none" type="text" name="title_home" value="<?php echo $title; ?>" />
        <input style="display: none" name="favorite_delete_home" value="favorite_delete_home" />
        <input id="btn_mylist_on" type="submit" value="-">
    </form>
</div>
        
<?php } else { // NOT A FAVORITE ?>

<div id="fav_add" style="display: inline-block;">
    <form style="display: inline-block;" class="my_list_add">
        <input id="new_releases" type="image" name="image" src="images/<?php echo $img ?>"><br />
        <input style="display: none" type="text" name="title_home" value="<?php echo $title; ?>" />
        <input style="display: none" name="favorite_home" value="favorite_home" />
        <input id="btn_mylist_default" type="submit" value="+">
    </form>
</div>

<?php } ?>
    
<?php  } // END WHILE LOOP ?>

            <script>
                $(function () {
                  $('.my_list_add').submit('click', function (event) {
                    event.preventDefault();
                      $.ajax({
                        type: 'POST',
                        url: 'ajax/mylist.php',
                        data: $('.my_list_add').serialize(),
                        success: function (data) {
                          $('#fav_add').html("Successfully Added");
                        }
                      });
                    });
                  });
                $(function () {
                  $('.my_list_delete').submit('click', function (event) {
                    event.preventDefault();
                      $.ajax({
                        type: 'POST',
                        url: 'ajax/mylist.php',
                        data: $('.my_list_delete').serialize(),
                        success: function (data) {
                          $('#fav_delete').html("Successfully Removed");
                        }
                      });
                    });
                  });
            </script>

这是来自 ajax/mylist.php 的代码

<?php

$username = $_COOKIE["username"];

include "../includes/db_connector.php"; ?>

<?php if ( isset( $_POST[ 'favorite_home' ] )) { // HOMEPAGE AJAX ATTEMPT       
$stmt_favorites = $db_connect->prepare("INSERT INTO my_list (title, username) VALUES (?, ?)");
$stmt_favorites->bind_param("ss", $title_home, $username);
$title_home = $_POST['title_home'];
$result=$stmt_favorites->execute();
$stmt_favorites->close();  
} ?>

<?php if ( isset( $_POST[ 'favorite_delete_home' ] )) { // HOMEPAGE AJAX ATTEMPT
$stmt_favorites = $db_connect->prepare("DELETE FROM my_list WHERE title = ? AND username = ?");
$stmt_favorites->bind_param("ss", $title_home, $username);
$title_home = $_POST['title_home'];
$result=$stmt_favorites->execute();
$stmt_favorites->close();
} ?>

我尝试了多次 Google 和 Stack Overflow 搜索，但找不到任何解决方案来解决我的问题。