Кнопка удаления ответа срабатывает только 1 раз, если я не обновляю страницу
У меня есть форма для комментариев, на каждый комментарий есть ответы. Мне удалось запрограммировать систему, чтобы при отправке нового комментария с использованием ajax php и jquery комментарий отображался в списке ответов. Теперь я программирую кнопку удаления ответа также с помощью ajax php и jquery. Что происходит, когда я обновляю страницу, я могу удалить ответный комментарий первой кнопки удаления, которую я нажимаю! и после этого, когда я нажимаю «Удалить», чтобы получить еще один ответный комментарий, ничего не происходит. Затем, если я перезагружаю страницу, я могу удалить еще один ответный комментарий, на который я нажимаю, но не более одного ответа после каждого обновления. Мне нужна ваша помощь, чтобы иметь возможность удалить более одного ответа без обновления страницы
Я опубликую коды для jquery и ajax, пожалуйста, дайте мне знать, нужны ли другие коды
вот мои коды jquery и ajax для кнопки удаления:
// Delete a reply
$('.delete_board_reply_button').click(function() {
var deleteReplyButtonParent = $(this).attr("id");
var idArray = deleteReplyButtonParent.split("-");
var boardReplyId = idArray[0];
//console.info(boardReplyId);
var url = "widgets/delete_board_reply.php";
$.ajax({
url: url,
type: "POST",
data: {
reply_id: boardReplyId
},
success: function(data) {
// here i make a custom pop up alert
},
error: function(jqXHR, textStatus, errorThrown) {
console.info(jqXHR);
}
});
var commentId_attr = $(this).parent().parent().attr("id");
var commentArray = commentId_attr.split("-");
var boardCommentId = commentArray[0];
console.info(boardCommentId);
loadBoardReplies(boardCommentId);
});<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class = "reply_comment_div" id = "<?php echo $reply_id;?>-boardReplyDelete">
<a href = "profile.php?user_id=<?php echo (int)$reply_user_id;?>" class = "board_comments_div_picture">
<img src = "
<?php
$profile_image = $reply_user_data['profile_picture'];
$profile_image_thumb = "uploaded_pictures/profile/$reply_user_id/" . $reply_user_id . "small.png";
if ($profile_image == "") {
if ($comment_user_data['gender'] == "Male"){
echo "images/ProfilePicMale.png";
} else {
echo "images/ProfilePicFemale.png";
}
} else {
echo $profile_image_thumb;
}
?>" width = "50px" height = "50px" alt = "" title = ""/>
</a>
<a href = "profile.php?user_id=<?php echo (int)$reply_user_id;?>" class = "board_comments_reply_link">
<?php echo ucfirst(htmlentities($reply_user_data['first_name'])) . " " . ucfirst(htmlentities($reply_user_data['last_name']));?>
</a>
<?php
if ($user_id == $_SESSION['user_id']){
?>
<a href = "edit_comment_board.php?comment_id=<?php echo $reply_comment_id;?>" class = "edit_comment_button_board">Edit</a>
<input type = "button" class = "delete_board_reply_button" value = "Delete" name = "delete_board_reply_button" id = "<?php echo $reply_id;?>-replyId" />
<?php
}
?>
<div class = "board_comment_submited_on">
submitted
<?php echo time_of_post($reply_timestamp);?>
</div>
<span class = "comment_content_span"><?php echo nl2br($reply_text);?></span>
</div>Обновлено: Я провел некоторое исследование вставки построчно для кодов jquery для кнопки удаления. Итак, я обнаружил, что проблема возникает, когда я добавляю эту строку
loadBoardReplies(boardCommentId);
Которые относятся к этой функции:
function loadBoardReplies (value) {
var url = "widgets/board_reply_fetch.php";
$.ajax({
url: url,
method: "POST",
data: {
comment_id: value
},
success: function(data){
$("#"+value+"-").html(data);
},
error: function(jqXHR, textStatus, errorThrown){
console.info(jqXHR);
}
});
}
Но я не могу сказать, в чем проблема! если я прокомментирую эту строку, я могу удалить любой ответ, который хочу, за исключением того, что ответы не будут обновляться, а удаленный ответ останется в DOM
да, я проверил источник страницы, и каждый идентификатор генерируется там, где он должен
Ответы 1
вы уверены в этом?
var commentId_attr = $(this).parent().parent().attr("id");
Кажется, $(this).parent() == <div> в этой структуре HTML. Вы пробовали с этим?
С Уважением
да, я уверен, дело в том, что после обновления страницы первый ответ, который я нажимаю из любого комментария, удаляется, но не более 1 ответа на комментарий. this: var commentId_attr = $(this).parent().parent().attr("id"); возвращает мне идентификатор комментария, на который я отвечаю, поэтому parent (). parent () предоставит идентификатор комментария, а (this) .attr ("id") предоставит сам идентификатор ответа для удаления Кнопка, на которую я нажал, даст только 1 элемент, потому что это идея, и существует только 1 элемент с этим идентификатором, поэтому моя логика кажется правильной, но то, что она позволяет мне нажать удалить только для 1 ответа / com
Вы проверили правильность создания идентификаторов в разметке?