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"); 
     } 
     } 
    }); 
    });