如果不刷新,我无法在评论下获得 Ajax 的评论回复


I Cannot get comment reply by Ajax under comment without refresh

我无法在评论下获得Ajax的评论回复,但是回复保存在数据库中,如果我刷新Index.php页面,它会正确显示。所以我认为我的问题要么在我的回复显示元素(Div id/class or php)中,要么在 Ajax 回调中。

请帮助我。我不能做最后 7 天的事情。

我的索引.php框架

$results = mysqli_query($dbh,"SELECT * FROM comments_lite WHERE qazi_id='$tutid' ORDER BY id DESC LIMIT 20") or die(mysqli_error($dbh));
echo'<div class="content"><comment>';
    while($rows = mysqli_fetch_array($results)) {
        $id = $rows['id'];
        $username = $rows['username'];
        //etc all
            echo'<div class="post'.$id.'">
            //Comments goes here
                echo'<p class="name"><a href="#">'.$username.'</a> Says:</p>';
                echo'<span class="cdomment_time">'.$date.'</span><br/>
                <div class="avatarcnt">
                <img alt="" src="uploadprofile/'.$u_imgurl.'"/>
                </div>
                <div class="cdomment_text">';
                echo'.htmlentities($description).'<br>';
            echo'</div>';
    // Reply Start
    $query = "SELECT * FROM comments_reply WHERE parent_id ='".$id."'";
    $res = mysqli_query($dbh,$query);
    while($row = mysqli_fetch_array($res)){ 
        $parent_id = $row['parent_id'];
        $username = $row['username'];
        //etc all
            echo'<div class="rcontent"><replycomment><div class="reply'.$parent_id.'"><ul>
            //Reply goes here
                echo'<p class="name"><a href="#">'.$username.'</a> Says:</p>';
                echo'<span class="cdomment_time">'.$date.'</span><br/>
                <div class="avatarcnt">
                <img alt="" src="uploadprofile/'.$u_imgurl.'"/>
                </div>
                <div class="cdomment_text">';
                echo'.htmlentities($description).'<br>';
            </ul></div><replycomment></div>';
}   //reply while close 
}   //comment while close
echo'<comment></div>';          

我的回复.php框架

$results = mysqli_query($dbh,"SELECT * FROM comments_lite WHERE qazi_id='$tutid' ORDER BY id DESC LIMIT 1") or die(mysqli_error($dbh));
$row = $results->fetch_array();
$id = $row['id'];
    $res = mysqli_query($dbh,"SELECT * FROM comments_reply WHERE parent_id ='$id' LIMIT 1") or die(mysqli_error($dbh));
        while($row = mysqli_fetch_array($res)) {
            $parent_id = $row['parent_id'];
            $username = $row['username'];
            echo'<div class="rcontent"><replycomment><div class="reply'.$parent_id.'"><ul>';
            //New reply goes here
                echo'<p class="name"><a href="#">'.$username.'</a> Says:</p>';
                echo'<span class="cdomment_time">'.$date.'</span><br/>
                <div class="avatarcnt">
                <img alt="" src="uploadprofile/'.$u_imgurl.'"/>
                </div>
                <div class="cdomment_text">';
                echo'.htmlentities($description).'<br>';
            echo'</ul></div><replycomment></div>'; 

JavaScript { 这里$tutid是一个页面 ID,效果很好(如果你对此有任何困惑)}

$(document).ready(function(){
var inputReplycom = $(".replycom");
var inputTutid = $("#tutid");
var inputparent_id = $("#parent_id");
var commentList = $(".content > comment");  // update comment
//update reply
function updateReplybox(){
    var tutid = inputTutid.attr("value");
**(EDITED)** var RID = inputparent_id.attr("value");
    $.ajax({
        type: "POST", 
        url: "reply.php", 
        data: "action=update&tutid="+ tutid,
          complete: function(data){
**(EDITED)**
          $(".postreply"+RID).append(data.responseText);
          $(".postreply"+RID).fadeIn(2000);
          }
    });
}
//on submit reply
$(".replyfrm").click(function(){
var replycom = inputReplycom.attr("value");
var parent_id = inputparent_id.attr("value");
var tutid = inputTutid.attr("value");
        $(".loader").fadeIn(400);
        $.ajax({
        type: "POST", 
        url: "reply.php", 
        data: "action=insert&replycom="+ replycom + "&parent_id="+ parent_id + "&tutid="+ tutid,
            complete: function(data){
            $(".reply_here").hide();
            updateReplybox();
            }
        });
    //we prevent the refresh of the page after submitting the form
    return false;
});
});

编辑:我现在正在尝试的新编辑代码,在刷新前显示淡入淡出空白结果

In index.php change:
<div class="postreply'.$parent_id.'"><ul>
In reply.php change:
<div class="postreply'.$parent_id.'"><ul>
JavaScript change
function updateReplybox(){
    var tutid = inputTutid.attr("value");
    var RID = inputparent_id.attr("value");
        //just for the fade effect
    $.ajax({
    type: "POST", 
    url: "reply.php", 
    data: "action=update&tutid="+ tutid,
       complete: function(data){
          $(".postreply"+RID).append(data.responseText);
          $(".postreply"+RID).fadeIn(2000);
       }
    });
}

以下是你的 js

$('#commentButton').click(function() {
replycom = document.getElementById('inputReplycom').value;
parent_id = document.getElementById('inputparent_id').value;
tutid = document.getElementById('inputTutid').value;
$.post('reply.php', {'replycom': replycom, 'parent_id': parent_id, 'tutid': tutid}, function(data) {
    var parsed = JSON.parse(data);
    var html = '<section class="comment-list block"><article id="comment-id-1" class="comment-item"> <a class="pull-left thumb-sm"> <img src="/uploads/' + parsed.photo +'" class="img-circle"> </a> <section class="comment-body m-b"> <header> <a href="#"><strong>'+parsed.username+'</strong></a> <span class="text-muted text-xs block m-t-xs">'+parsed.created_at.date+' </span> </header> <div class="m-t-sm">'+ parsed.comment +'</div></section> </article> </section>';
    $('#extraComments').append(html);
}).success(function() {
    $('#comment').val('');
    $('#commentSuccess').html('Submitted successfully!').show().delay(5000).fadeOut();
}).fail(function() {
    $('#commentFailed').html('Failed!').show().delay(5000).fadeOut();
});

});

在您的回复中.php获取数据

$replycom = $_GET['replycom'];
$parent_id = $_GET['parent_id'];
$tutid = $_GET['tutid'];
//and process it 

请相应地更改变量名称

编辑的代码:

echo json_encode(array('replycom' => $replycom, 'parent_id' => $parent_id, 'tutid' => $tutid));