div没有被ajax删除

时间:2015-04-11 16:35:32

标签: javascript php jquery html ajax

我正在开发一个用户可以发帖和评论的应用程序。

我对帖子有一些评论,我希望通过点击关联的' x'来删除特定评论。按钮。

我对remove-comments.php页面进行Ajax调用,该页面从数据库中删除了注释。

这是我的html / php删除评论:

<div class="add_removal_<?php echo $reply_id?>" style="pading:-20px;">
    <div class="col-xs-15">
        <img class="direct-chat-img" src="/BootStrapProject/Profile/uploads/<?php echo $profileimage?>" alt="message user image" style="width:40px;height:25px;"/><!-- /.direct-chat-img -->
        <div class="direct-chat-text col-xs-15" style='word-wrap:break-word;'>
            <div style="font-size:14px;"><a href='#'><?php echo $rfullname.': '?></a><?php echo $reply?><div class='pull-right' style='font-size:10px;'><?php echo  time_stamp($rtime);?> ago  <button style="width:2px;height:20px;"type="submit" id="comment_delete" onclick=CommentDelete("<?php echo $reply_id?>")>X</button></div></div>
        </div>
    </div>
    <!-- /.direct-chat-text -->
</div><!-- /.direct-chat-msg --> 

这是我的JS代码,调用remove-comments.php

<script type="text/javascript" src="WallPost1/js/imageUpload/jquery.min.js"></script>
<script type="text/javascript" src="WallPost1/js/imageUpload/jquery.form.js"></script>  
<script type="text/javascript">
function CommentDelete(id){
        var self = $(this); 
        alert("in delete comment 2: "+ self);
        //var ID = $(this).attr("id");
        var dataString = "id="+id;
        alert(dataString);
        //var data = '';
        //  call ajax
        $.ajax ({
        url: "WallPost1/remove-comments.php", 
        type: 'post', 
        dataType: 'json', 
        data: dataString,
        success: function(json){                                        
                    if(json.error) {
                        alert(json.error);
                        return false;
                    }                       
                    $("#add_removal_"+id).remove();
                    //alert(json.success);
                } // end success function   
        }); 
        return false;           
    };
</script>

这是remove-comments.php代码。

<?php
include("dbcon.php");
include("session.php");
$error = '';
$success = '';
$response = array();
$reply_id=$_POST['id'];
$id = isset($_REQUEST['id'])?trim($_REQUEST['id']):'';
if($id){
    $query = "delete from reply where reply_id = '$reply_id'";
    if (!mysqli_query($con,$query)){
        die('Error: ' . mysqli_error($con));
    }
    else{
        $msg ="<br> 1 record added";
    }
    $success = 'Comment has been deleted successfully.';
}
else
    $error = 'Comment doesn\'t deleted successfully. Please try again later.';
$response = array('error' => $error, 'success' => $success);
echo json_encode($response);
exit(); 
?>

所以,一旦我点击了&#39; x&#39;按钮删除注释,JS被调用。它调用remove-comments.php页面并使用comment_id从DB中删除注释。

但是它不会从UI中删除,直到刷新页面。

请帮我解决问题。谢谢!

1 个答案:

答案 0 :(得分:0)

传递id变量,以便成功回调可以访问它。

    $.ajax ({
    url: "WallPost1/remove-comments.php", 
    type: 'post', 
    dataType: 'json',
    commentId: id, 
    data: dataString,
    success: function(json){                                        
                if(json.error) {
                    alert(json.error);
                    return false;
                }                       
                $("#add_removal_"+this.commentId).remove();
                //alert(json.success);
            } // end success function   
    }); 

请注意commentId: id,位。

接下来,更改

<div class="add_removal_<?php echo $reply_id?>" style="pading:-20px;">

<div id="add_removal_<?php echo $reply_id?>" style="pading:-20px;">