PHP＆AJAX刪除僅適用於第一行

Question

我做了一個簡單的PHP博客系統。在添加發布頁面下，用戶可以給出標題和正文文本。帖子位於帖子頁面上，用戶可以刪除帖子。

我的問題是：只有第一篇文章可以刪除。其他人沒有。

這裏是我的節目代碼的帖子：

<?php 
$database->query('SELECT * FROM posts'); 
$rows = $database->resultSet(); 
?> 

<div class="container"> 
<?php foreach ($rows as $row) : ?> 
<h2><?php echo $row['title']; ?></h2> 
<p><?php echo $row['body']; ?></p> 
<small><?php echo $row['create_date'] ?></small> 
<form method="post"> 
    <input id="deleteid" type="hidden" name="delete_id" value="<?php echo 
    $row['id'] ?>"> 
    <input id="delete_button" class="btn btn-primary" type="submit" 
    name="delete" value="Delete"> 
</form> 
<?php endforeach; ?> 
<br><br> 
</div> 

這是我的AJAX代碼：

$("#delete_button").click(function() { 
    $.ajax({ 
     type: "POST", 
     url: "?action=delete", 
     data: "delete_id=" + $("#deleteid").val(), 
     success: function (result) { 
     if (result == 1) { 
      //window.location.assign("views/posts.php"); 
     } else { 
      alert("Error"); 
     } 
     } 
    }); 
    }); 

Answer 1

不能使用相同的ID爲多輸入/ DIV或其他任何HTML標籤。請將id =「deleteid」更改爲class =「deleteid」，並更改您的點擊事件。所以，你的這條線將改爲 -

<input class="deleteid" type="hidden" data-deleteid="<?php echo 
    $row['id'] ?>" name="delete_id" value="<?php echo $row['id'] ?>"> 

你的Ajax代碼將變爲 -

$(".delete_button").click(function() { 
    var deleteid = $(this).data('deleteid'); 
    $.ajax({ 
     type: "POST", 
     url: "?action=delete", 
     data: "delete_id=" + deleteid , 
     success: function (result) { 
     if (result == 1) { 
      //window.location.assign("views/posts.php"); 
     } else { 
      alert("Error"); 
     } 
     } 
    }); 
    });