【问题标题】:How to make reply to comment reference the id of comment in forum如何回复评论引用论坛中评论的id
【发布时间】:2017-06-03 10:41:33
【问题描述】:

我已经与这段代码斗争了几个小时,没有任何进展。任何人都可以帮助我解决这个问题吗? 我正在我网站上的一个论坛页面上工作,其中包含 cmets 和对 cme​​ts 功能的回复。 单击每个 cmets 下的回复按钮时,会动态显示一个文本区域以进行回复。回复将插入到数据库中,其中包含回复 id 和原始评论 id(在发布原始评论时生成的 id 已被回复)。 我现在面临的挑战是,对论坛上任何 cmets 的回复似乎只引用了最新评论的 id(可能是因为回复表单是动态生成的)。因此,在我的数据库中,他们拥有最新评论的 ID。这实际上意味着在获取时,回复将全部排在最新评论下。我需要的是一种引用已回复评论的 id 的方法。 这是我的php代码:

<?php
        require("includes/conn.php");
        $stmt=$conn->prepare("SELECT post_id, user, topic, post, time FROM post_tb ORDER BY time DESC");
            $stmt->execute();
            $result = $stmt->get_result();
            $num_of_rows = $result->num_rows;
            if ($num_of_rows > 0){
                while ($row = $result->fetch_assoc()){
                    $post_id = $row['post_id'];
                    $user = $row['user'];
                    $topic = $row['topic'];
                    $post = $row['post'];
                    $time = $row['time'];
                    $time = date('M dS, Y g:i A', strtotime($time));
                    echo '<div>
                            <div>
                                <h5><strong>'.$user.'</strong></h5><h6>'.$time.'</h6>
                                <h5><strong>'.ucfirst($topic).'</strong></h5>
                                <p data-id="'.$post_id.'">'.$post.'</p>
                            </div>      
                            <div>
                                <button type="button" class="btn btn-primary rep" id="but_rep" data-id="'.$post_id.'">Reply</button>
                            </div>
                            <form id="comment_reply" data-id="'.$post_id.'" method="post" action="">
                                <input type="text" class="hidden" value="'.$post_id.'" id="post_id">
                                <input type="text" class="hidden" value="'.$user.'" id="user">
                                <textarea class="form-control" rows="3" name="post_rep" id="post_rep"></textarea>
                                <button type="submit" class="btn btn-primary" id="post_rep_sub">Submit</button>
                            </form>
                        <div/>';
                    }
                }
    ?>

还有我的 Ajax/jquery:

$("form#comment_reply").hide();//Comment reply form hidden at page load
//To hide reply button and show the reply form
$(document).on('click', 'button.rep', function(e){
    e.preventDefault();
    var closestDiv = $(this).closest('div');
    var closestForm = $(closestDiv).next('form#comment_reply');
    $(closestDiv).fadeOut();
    $(closestForm).fadeIn();
});
//To process comment reply
$(document).on("click", "form button#post_rep_sub", function(e){
        e.preventDefault();
    var reply = $("form textarea#post_rep").val();
    var name = $("input#user").val();
    var post_id = $("input#post_id").val();
    if (reply != ''){
        $.post('insert_post_reply.php', {'reply':reply, 'name':name, 'post_id':post_id}, function(data){
            if (data = 'yes'){
               $("form textarea#post_rep").val("");
               fetchCommentReply();
            }
        });
    }else{
        return false;
    }
});

【问题讨论】:

  • fetchCommentReply(); 是什么做什么?
  • @mplungjan.thanks.这是一个根据回复的评论的 id 获取对 cme​​ts 的回复的函数。问题不在于它,因为即使是 alert(post_id) 也会不断提醒最新评论的 id。
  • 请发minimal reproducible example - 如果您认为这是 PHP 问题,那么我看不到它。如果它只是一个 jQuery 问题,那么请使用 &lt;&gt; 按钮发布由 PHP 呈现的 HTML,以便我们查看您是否有关闭问题 - 这是最有可能的

标签: php jquery ajax


【解决方案1】:

我认为问题在于点击处理程序“form button#post_rep_sub”

您使用以下语句读取 post_id:var post_id = $("input#post_id").val(); 但无论按下哪个按钮,这总是返回最后一个 post_id。

为了验证我的观点,您可以添加它并观察 javascript-console:

var test1 = $("input#post_id");
var test2 = $("input#post_id").length;
console.log(test2);

如果您看到一个数字 >1,那么您知道要修复点击处理程序“form button#post_rep_sub”

【讨论】:

  • 谢谢@Tseh。让我修改我的 var post_id = $("input.hidden").val() 以明确,隐藏输入字段中声明的评论 id 的值。回到您的建议,console.log 测试返回 0。
  • @Tseh..我的意思是说console.log测试仍然返回了最新评论的id
  • 您能提供由 PHP 脚本生成的 html 吗?这将使我能够重现您的问题。您可以在 Google Chrome 中通过右键单击然后在菜单中选择“检查”来执行此操作。
  • 谢谢@Tseh。在我原来的问题中,我发布了一个 php 代码,它为评论和回复生成表单 html。我使用 Jquery 在页面加载时隐藏回复表单,然后在回复按钮的“单击”事件中,回复表单淡入。现在,错误地,所有对任何 cmets 的回复都插入了最新的评论 ID评论。由于我的 fetchCommentReply sql 会获取已回复评论的 WHERE commentId = id 回复,因此所有回复都被提取并显示在最新评论下,而不是在个别 cmets 下被回复。我希望它有意义吗?
  • @banky:这是否意味着您的问题已解决?如果是这样,请支持我的回答。看来我的回答对你有帮助!
【解决方案2】:

主要问题是您的 php 代码多次生成具有相同 id 的 html 元素(例如按钮)!然后 jquery 只将自己附加到第一个按钮。 此处已通过示例对此进行了说明:

How jQuery works when there are multiple elements with the same "id"?

解决方法:将 id 替换为 name-attribute!


根据 HTML 规范,页面上的 id 属性必须是唯一的(这不是网页设计师/开发人员刚刚发明的标准)

Is using the same id multiple times on a page bad practice even when I am not parsing through the page?


让我们仔细看看你的 php 生成了什么。您有多个具有相同 id 的元素,例如多次生成 id="but_rep" 的按钮。请注意,您只能在 html 文件中使用 id 一次! 因此,您不能假设 jquery 使用 id 可靠地附加事件处理程序!

                     <div>
                        <div>
                            <h5><strong>user 1</strong></h5><h6>'.$time.'</h6>
                            <h5><strong>topic 1</strong></h5>
                            <p data-id="101">post text1</p>
                        </div>      
                        <div>
                            <button type="button" class="btxtn btn-primary rep" id="but_rep" data-id="101">Reply</button>
                        </div>
                        <form id="comment_reply" data-id="101" method="post" action="">
                            <input type="text" class="hidden" value="101" id="post_id">
                            <input type="text" class="hidden" value="user 1" id="user">
                            <textarea class="form-control" rows="3" name="post_rep" id="post_rep"></textarea>
                            <button type="submit" class="btn btn-primary" id="post_rep_sub">Submit</button>
                        </form>
                    <div/> 
                    <div>
                        <div>
                            <h5><strong>user 2</strong></h5><h6>'.$time.'</h6>
                            <h5><strong>topic 2</strong></h5>
                            <p data-id="102">post text2</p>
                        </div>      
                        <div>
                            <button type="button" class="btxtn btn-primary rep" id="but_rep" data-id="102">Reply</button>
                        </div>
                        <form id="comment_reply" data-id="102" method="post" action="">
                            <input type="text" class="hidden" value="102" id="post_id">
                            <input type="text" class="hidden" value="user 2" id="user">
                            <textarea class="form-control" rows="3" name="post_rep" id="post_rep"></textarea>
                            <button type="submit" class="btn btn-primary" id="post_rep_sub">Submit</button>
                        </form>
                    <div/> 

【讨论】:

  • @Tseh 再次感谢您的帮助。现在我明白为什么我一直得到相同的 id。但是,我正在尝试修改我的代码以生成具有唯一名称属性的回复按钮,其值是被回复的评论的 id,与回复文本区域表单相同,但我在引用名称属性时遇到了挑战事件处理程序,因为它不断抛出错误:这是我在 jquery 中尝试的内容:var post_id = $("input#post_id").val(); $(document).on('click', 'button[name:"+post_id+"]', function(e){ e.preventDefault();alert("yes"); });
  • @banky:很荣幸能帮到你!请支持我的回答。
  • @Tseh 请我仍然在引用事件处理程序中的名称属性时遇到挑战,因为它不断在控制台上抛出未捕获的语法错误。请看我最后的评论
猜你喜欢
  • 1970-01-01
  • 2014-03-18
  • 2020-10-02
  • 1970-01-01
  • 2017-06-18
  • 1970-01-01
  • 1970-01-01
  • 2018-12-15
  • 1970-01-01
相关资源
最近更新 更多