php – 使用AJAX从数据库中删除记录

我有一个PHP文件,显示数据库中的数据.我正在使用while()来显示每条记录.

我的PHP文件：

<?PHP

    $flightTicketssql = "SELECT * FROM `flightbookings` WHERE username='$user' AND cancelled='no'";
    $flightTicketsQuery = $conn->query($flightTicketssql);

    while($flightTicketsRow = $flightTicketsQuery->fetch_assoc()) { ?>

    <tr>
        <td class="tableElementTags text-center"><?PHP echo $flightTicketsRow["bookingID"]; ?></td>
        <td class="tableElementTags text-center"><?PHP echo $flightTicketsRow["origin"]; ?></td>
        <td class="tableElementTags text-center"><?PHP echo $flightTicketsRow["destination"]; ?></td>
        <td class="tableElementTags text-center"><?PHP echo $flightTicketsRow["date"]; ?></td>
        <td class="tableElementTags text-center"><?PHP echo $flightTicketsRow["mode"]; ?></td>
        <td class="text-center"><span class="fa fa-remove tableElementTags pullSpan" id="deleteAccount"></span></td>
    </tr>

<?PHP } ?>

如果用户点击最后一个< td> (带有Font Awesome图标的那个),我希望从数据库中删除具有特定bookingID的记录.

为此,我需要使用jQuery .val()来识别值.

我的JS档案：

var id = $("**WHAT DO I PUT HERE ?**").val();

    $('#deleteAccount').click(function() {
        $.ajax({
            type: "POST",
            url: 'cancelTicket.PHP',
            data: { bookingID : id },
            success : function() {
                alert("Cancelled");
            }
        });
    });

我的cancel.PHP文件：

<?PHP

    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "database";

    $conn = new MysqLi($servername, $username, $password, $dbname);

    if ($conn->connect_error) {
        die("Connection Failed: " . $conn->connect_error);
    }

    $user = $_SESSION["username"];
    $id = $_POST["bookingID"];


    $cancelFlightBookingssql = "UPDATE `flightbookings` SET cancelled='yes' WHERE bookingID='$id'";
    $cancelFlightBookingsQuery = $conn->query($cancelFlightBookingssql);

我的问题是如何让jQuery识别用户想要取消的预订？我的意思是如何为< td>分配ID这样我就可以在JS中检索它的值.

我知道我无法正确地构建这个问题.对于那个很抱歉.

谢谢

解决方法:

这里有几个问题.首先,您需要使用span而不是id的类,否则它将被PHP循环复制到DOM中,这将导致无效的HMTL破坏您的click事件处理程序.

完成后,您需要在单击处理程序中设置id变量值,以便您可以找到与单击元素相关的td.你可以这样做：

<!-- repeated throughout your while loop -->
<td class="text-center">
  <span class="fa fa-remove tableElementTags pullSpan deleteAccount"></span>
</td>

$('.deleteAccount').click(function() {
  var id = $(this).closest('tr').find('td:first').text().trim();

  $.ajax({
    type: "POST",
    url: 'cancelTicket.PHP',
    data: {
      bookingID: id
    },
    success: function() {
      alert("Cancelled");
    }
  });
});