使用ajax更新mysql結果（設置為刪除）而不刷新頁面？

Question

我在名為 user_timeline 的 mysql 表中有數據行。

我在這個表中有一個標記為刪除的列。

我正在運行查詢以獲取表中已刪除 = 0 的所有結果。

$result = $conn ->query ("SELECT * FROM user_timeline WHERE user_id = '$p_id' AND deleted = '0' ORDER BY time_date DESC"); 

我想通過將其設置為 1，為用戶提供能夠在表中將結果標記為已刪除的選項。

我想我可以通過創建一個鏈接來做到這一點，該鏈接將發布到我的頁面 del_timeline.php

if(isset($_SESSION['CUSTOMER_ID'])){
    echo '<a id="del_t" href="assets/del_timeline.php?t_id='.$row['id'].'"><div class="delete_timeline"></div></a>';
    }

在 del_timeline.php 我有以下更新查詢：

<?php 
session_start();
include 'connect.php';

if(isset($_GET['t_id'])){
    $t_id = $conn->real_escape_string($_GET['t_id']);
    $myID = $_SESSION['CUSTOMER_ID'];
    $conn->query("Update user_timeline Set deleted = '1' Where id = $t_id AND user_id = $myID") ;

}
?>

可以想象，我表中的每個結果都有一個特定/唯一的 ID。 這樣它就可以跟蹤用戶試圖將哪個結果設置為已刪除。 雖然這通過普通的 href 點擊事件起作用。 我試圖讓它使用 ajax 運行以避免頁面刷新。

我不完全確定如何通過 ajax 傳遞 mysql $row 參數。 我已經嘗試了以下但它似乎不起作用。

<script>
$( "#del_t" ).submit(function( event ) {
    event.preventDefault(); // <---- Add this line

    $.ajax({
        type: "POST",
        url: "assets/del_timeline.php?t_id=$row['id']",
        data: $( "#del_t" ).serialize(),
        success: function(data) {
            // print here 

        },
        dataType: 'html' // for json response or 'html' for html response
    });
    </script>

請有人告訴我我哪里出錯了？

Answer 1

您不需要將 php 中的 id 添加到 ajax 函數中。 您可以使用鏈接中的 href 地址。

$( "#del_t" ).click(function( event ) {
  event.preventDefault();

  $.ajax({
    type: "POST",
    url: $(this).attr('href'),
    data: '',
    success: function(data) {
        // print here 

    },
    dataType: 'html' // for json response or 'html' for html response
});

或者，更好的是，將 id 放入<a>的屬性中（例如在標題中），在 php 中使用 $_REQUEST。 在 ajax 中從該屬性中獲取 id 以將其傳遞到通過 post 發送的數據中。 在 php 中：

echo '<a id="del_t" href="assets/del_timeline.php?t_id='.$row['id'].'" title="'.$row['id'].'"><div class="delete_timeline"></div></a>';

在 del_timeline.php 中：

if(isset($_REQUEST['t_id'])){
  $t_id = $conn->real_escape_string($_REQUEST['t_id']);
  //your code
}

阿賈克斯：

$( "#del_t" ).click(function( event ) {
  event.preventDefault();

  $.ajax({
    type: "POST",
    url: 'assets/del_timeline.php',
    data: 't_id='+$(this).attr('title'),
    success: function(data) {
        // print here 

  },
  dataType: 'html' // for json response or 'html' for html response
});

Answer 2

首先，您需要附加事件處理程序以防止用戶單擊href鏈接時重新加載頁面。 在你的javascript中考慮這樣的事情：

$( document ).on( 'click', 'a[id="del_t"]', function( event ) {
  event.preventDefault();
  $.ajax( {
    type: 'POST',
    url: $( this ).attr( 'href' )
  } )
  .done( function( response ) {
    // Do something with the success response...
    // Maybe delete the row containing deleted data
  } );
} );

然后，您需要從del_timeline.php發送一些數據。 使用 PHP 的echo將 mysql 結果或任何 PHP 變量傳遞給客戶端瀏覽器（您的 javascript 代碼）。

<?php 
  session_start();
  include 'connect.php';

  if(isset($_GET['t_id'])){
    $t_id = $conn->real_escape_string($_GET['t_id']);
    $myID = $_SESSION['CUSTOMER_ID'];
    $conn->query("Update user_timeline Set deleted = '1' Where id = $t_id AND user_id = $myID") ;

    // Send some success response
    echo 'success'; // or any data you want to send
  }

  // Send some error response
  echo 'error';
?>