php - 通过 jquery ajax 更新评论时重复帖子条目

标签 php jquery mysql ajax

好的,所以我认为我已经解决了这个问题。但解决方案仍然逃避我!

我有一个支持 ajax 的社交聊天应用程序,允许使用 php、mysql 和 jquery 构建评论和点赞等。但是当我发表评论时,ajax 会返回一个重复的帖子,并更新了评论,所以当你再次发表评论时,你最终会得到多个重复的帖子。 Msql 条目很好(即没有重复)。我的所有其他功能和更新都工作正常,所以这是一个严重的问题!

对于代码量,我深表歉意,但我只是想为您提供所有信息 - 非常感谢所有的想法和答案!

这是起始页 HTML:

 <html>

 <div class="usermsg">

   <?php


    $sql = "SELECT post.post, post.posttime, post.pid_imageurl, post.likes, user.name, comments.comment, user.uid_imageurl, comments.comment_uid, post.pid
                FROM post
                INNER JOIN user
                ON post.uid=user.uid
                LEFT JOIN comments
                ON comments.comment_pid=post.pid
                ORDER BY pid DESC";



    $result = mysql_query($sql);


    while($row=mysql_fetch_assoc($result)){?>



    <?php
    $pid = $row['pid'];
    $formattime = date("g:i:a",$row['posttime']);
    //echo $row['pid']; for testing
    echo '<p class="speechbubble">'.$row['post'].'<br><br><img class= "userprofileimage" src="'.$row['uid_imageurl'].'" alt="user profile image"/> Posted by '.$row['name'].' at '.$formattime. '</p>';


     ?>

         <p class="likepara">this post has <? echo $row['likes']; ?> likes  <a class="like" pid=<? echo $row['pid']; ?> href="#">like</a></p>    

           <div class="editable" pid="<? echo $row['pid'];?>" contentEditable="true">add comment...</div>

   <?php

    $sql_comments = "SELECT comments.comment, comments.comment_time, user.name, user.uid_imageurl FROM comments
                    INNER JOIN user
                    ON  comments.comment_uid = user.uid
                    WHERE comment_pid = '$pid' ORDER BY cid DESC";


    $result_comments = mysql_query($sql_comments);                
    $numrows_comments=mysql_num_rows($result_comments);//num of rows


    if($numrows_comments==0) //no comments
      {
           echo '<p class="commentsheader">Comments</p><br>';
           echo 'This post has no comments yet, be the first!';
           echo '<br><br><br><hr><br><br>';

      }else{
           echo '<p class="commentsheader">Comments</p><br>';
     while($row=mysql_fetch_assoc($result_comments)){

       $formattime_comment = date("g:i:a",$row['comment_time']);
       echo '<p class="comment">'.$row['comment'].'<br><img class="commentprofileimage" src="'.$row['uid_imageurl'].'" alt="user profile image"/>Posted by '.$row['name']. ' at ' .$formattime_comment. '</p>';
       //echo '<img class="commentprofileimage" src="'.$row['uid_imageurl'].'" alt="user profile image"/>'

     }//$sql_comments

     echo '<hr><br><br>';


      }//else end



    }//$sql


    ?>




   </div><!--user msg--


   </html>

jquery函数:

   $(".editable").live('click', function(){

        $(this).empty();

        $(this).mouseout(function() {

            var comment = $(this).html();
            var postid = $(this).attr("pid");
            var commentuserid = $("#loggedin").attr("uid");

            if(comment == ""){
                return false;
            }else{
                    var datastring = 'comment=' + comment + '&postid=' + postid + '&commentuserid=' + commentuserid;


                    //save with ajax clear box and then load back in
                    $.ajax({
                    type: "POST",
                    url: "uploadcomment.php",
                    data: datastring,
                    success: function(data){


                    $(".usermsg").html(data);

                                }
                    });
            }
        });
  });

更新 php(与正在更新的初始 html 页面基本相同)。

    <?php

    include("connectdb.php");
    include_once("secure.php");



    //still repeating posts when mutiple comments added?
    $commentpostid = $_POST['postid'];
    $commentuserid = $_POST['commentuserid'];
    $comment = protect($_POST['comment']);
$time =time();

$comment = strip_tags($comment);
    $time =time();

$sql_insert_comments = "INSERT INTO comments
              (comment_uid, comment_pid, comment, comment_time)
              VALUES
              ($commentuserid,$commentpostid, '$comment', $time)";

$insert_comments_result = mysql_query($sql_insert_comments);

    ?>

     <?

    $sql = "SELECT post.post, post.posttime, post.pid_imageurl, post.likes, user.name, comments.comment, user.uid_imageurl, comments.comment_uid, post.pid
                FROM post
                INNER JOIN user
                ON post.uid=user.uid
                LEFT JOIN comments
                ON comments.comment_pid=post.pid
                ORDER BY pid DESC";

    $result = mysql_query($sql);

    while($row=mysql_fetch_assoc($result)){?>

    <?
    $pid = $row['pid'];
    $formattime = date("g:i:a",$row['posttime']);
echo '<p class="speechbubble">'.$row['post'].'<br><br><img class= "userprofileimage" src="'.$row['uid_imageurl'].'" alt="user profile image"/> Posted by '.$row['name'].' at '.$formattime. '</p>';

    //echo '<p class="speechbubble">'.$row['post'].'</p>';
    //echo '<p class="msgholder" >Posted by '.$row['name'].' at '.$formattime. '<img class= "userprofileimage" src="'.$row['uid_imageurl'].'" alt="user profile image"/></p>';
?>

    <p class="likepara">this post has <? echo $row['likes']; ?> likes  <a class="like" pid=<? echo $row['pid']; ?> href="#">like</a></p>    

    <div class="editable" pid="<? echo $row['pid'];?>" contentEditable="true">
             add comment...
    </div>

    <?

    $sql_comments = "SELECT comments.comment, comments.comment_time, user.name, user.uid_imageurl FROM comments
                    INNER JOIN user
                    ON  comments.comment_uid = user.uid
                    WHERE comment_pid = '$pid' ORDER BY cid DESC";


    $result_comments = mysql_query($sql_comments);                

      $numrows_comments=mysql_num_rows($result_comments);//num of rows


              if($numrows_comments==0) //no comments
            {
                 echo '<p class="commentsheader">Comments</p><br>';
                 echo 'This post has no comments yet, be the first!';
                 echo '<br><br><br><hr><br><br>';

            }else{
                  echo '<p class="commentsheader">Comments</p><br>';
                  while($row=mysql_fetch_assoc($result_comments)){
                  $formattime_comment = date("g:i:a",$row['comment_time']);
                   //echo '<p class="comment">'.$row['comment'].'</p>';
                   //echo '<p class="commentposter">posted by '.$row['name']. ' at ' .$formattime_comment. '<img class="commentprofileimage" src="'.$row['uid_imageurl'].'" alt="user profile image"/></p>';
                    echo '<p class="comment">'.$row['comment'].'<br><img class="commentprofileimage" src="'.$row['uid_imageurl'].'" alt="user profile image"/>Posted by '.$row['name']. ' at ' .$formattime_comment. '</p>';

            }//$sql_comments

            echo '<hr><br><br>';

      }//else end

    }//$sql


    ?>




    </div>









</div>

最佳答案

我认为你应该去掉 update.php 中的后期渲染。

编辑:我有点迷失在您的代码中。如我所见,您完全重新渲染了帖子并替换了原来的帖子。

您应该只更新评论,实际上您不必从 ajax 请求中获得任何 html 响应。成功/失败标志就足够了。成功后可将可编辑区的新评论放到评论列表的底部(或顶部)。

更新 php:

include("connectdb.php");
include_once("secure.php");

//still repeating posts when mutiple comments added?
$commentpostid = protect($_POST['postid']);
$commentuserid = protect($_POST['commentuserid']);
$comment = protect($_POST['comment']);
$time =time();

$comment = strip_tags($comment);

$query = "INSERT INTO comments
            (comment_uid, comment_pid, comment, comment_time)
          VALUES
            ($commentuserid ,$commentpostid, '$comment', $time)";

if(mysql_query($sql_insert_comments))
{
    echo "OK";
}
else
{
    echo "FAIL";
}

您将获得“OK”或“FAIL”作为响应数据。所以你可以在 JS 中做出正确的举动:

$(".editable").live('click', function(){
    $(this).empty();
    $(this).mouseout(function() {
        var comment = $(this).html();
        var postid = $(this).attr("pid");
        var commentuserid = $("#loggedin").attr("uid");

        if(comment == ""){
            return false;
        }else{
            var datastring = 'comment=' + comment + '&postid=' + postid + '&commentuserid=' + commentuserid;
            //save with ajax clear box and then load back in
            $.ajax({
                type: "POST",
                url: "uploadcomment.php",
                data: datastring,
                success: function(data){
                            if(data == "OK") {
                                //put comment into the comment list
                            } else {
                                alert('error');
                            }
                         }
            });
        }
    });
});

您应该为此稍微修改您的评论列表。您应该将评论放入容器 div 中,这样您就可以使用 jQuery 将新提交附加到列表中,例如

$("#post_1 div.comment_container").append($("<div/>").text('comment text'))

还需要将帖子存储在已签名的包装器中,以便能够确定应该更新哪个帖子的评论列表。所以页面的结构应该是这样的:

<div class="post_list">
    <div class="post" id="post_1">
        <!-- post body -->
        <div class="comment_container">
            <!-- comments -->
        </div>
    </div>

    <div class="post" id="post_2">
        <!-- post body -->
        <div class="comment_container">
            <!-- comments -->
        </div>
    </div>

    <div class="post" id="post_3">
        <!-- post body -->
        <div class="comment_container">
            <!-- comments -->
        </div>
    </div>
    ...
</div>

编辑:真正的解决方案是从您获取帖子的查询中删除“左连接评论”。联接使行相乘。

例如: 您有 A、B 帖子,评论 A <= a,b 和 B <= c,d,e。 如果我是正确的,查询结果将是 5 行。

关于php - 通过 jquery ajax 更新评论时重复帖子条目,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8742957/

相关文章:

javascript函数只传递一个特定参数

php - 检查数组中是否存在对象

javascript - jQuery:在用户点击 Iphone 时播放音频

php - 为什么在这行代码中这个零

php - 与同一模型 : from CakePHP 2. x 到 CakePHP 3.x 的多重关系

php - 循环遍历多维对象的递归PHP函数

php - 在 mysql 中编写此查询时出现问题(在论坛中标记已读消息)

jquery - 如何使用 Jquery 动态更改 HTML.CheckBoxFor

jquery - 将 jQuery POST 发送到 Django View

c# - 当我用其答案填充 DataTable(使用 DataAdapter)时,不应该返回任何内容的 SQL SELECT 命令会返回什么?