Ajax - 分别从数据库中为每个评论加载数据答案

【问题标题】：Ajax - load data from database for every comment separatelyAjax - 分别从数据库中为每个评论加载数据
【发布时间】：2019-02-12 17:57:15
【问题描述】：

我有一个带有 textarea 和 dropzone 的表单，用于上传图片和提交按钮。单击提交按钮时 - 创建新评论并将 textarea 内容保存到数据库，所有图像都添加到 dropzone（它们存储在服务器和数据库中）。

我正在尝试通过 ajax 加载包含 cmets 的 div，并且在每个评论下方应该显示该特定评论的所有图像。

我正在这样调用函数：

<div id="comments_ticket_div"><?php echo commentsTicketList($id); ?></div>

这是我的 mysql 查询和输出函数：

function commentsTicketList($id){
    global $dbh1;
    $query = $dbh1->query("SELECT a.*, b.avatar, b.first_name, b.last_name FROM `tickets_comments` AS a
    INNER JOIN users AS b
    ON a.tickets_comments_user = b.user_id
    WHERE tickets_comments_parent = $id AND comments_parent=0 ORDER BY a.tickets_comments_date DESC");
    $data = "";
    while ($a_row = mysqli_fetch_array( $query )) {
        $tickets_comments_id = $a_row['tickets_comments_id'];

        $data .= '<span class="timeline-seperator text-center"> <span>'.$a_row['tickets_comments_date'].'</span></span>
                    <div class="btn-group pull-right"></div></span>
                    <div class="chat-body no-padding profile-message">
                        <ul>
                            <li class="message">
                            ';                      
                            if (!empty ($a_row['avatar'])){
                                    $data .= '<img src="'.ASSETS_URL.'/img/avatars/'.$a_row['avatar'].'-50.png" alt="User" class="" />
                                              ';
                            } else {
                                $data .= '<img src="'.ASSETS_URL.'/img/avatars/sunny.png" alt="User" class="" />';
                            }

        $data .= '              
                                <span class="message-text"> <a href="javascript:void(0);" class="username">'.$a_row['first_name'].' '.$a_row['last_name'].' <!--small class="text-muted pull-right ultra-light"> 2 Minutes ago </small--></a>
                                '.$a_row['tickets_comments_body'].'
                                <div id="refresh-gallery">';

        $queryx = $dbh1->query("SELECT img_url FROM `tickets_attachments` WHERE parent_comment_id = $tickets_comments_id AND parent_ticket_id = $id");
        while ($b_row = mysqli_fetch_array( $queryx )) {
            $data .= '<p>'.$b_row['img_url'].'</p>';
        }   
        $data .= '              </div>
                                <ul class="list-inline font-xs">
                                    <!--li>
                                        <a href="javascript:void(0);" class="text-info"><i class="fa fa-reply"></i> Odgovori</a>
                                    </li-->
                                    <!--li>
                                        <a href="javascript:void(0);" id="'.$tickets_comments_id.'" class="text-danger deletecomment">Obriši</a>
                                    </li-->
                                </span>

                                </ul>
                                <!--input id="replubtn" name="replubtn" class="form-control input-xs" placeholder="Type and enter" type="text"-->
                            </li>
                        </ul>

                    </div>';                    
    }
    return $data;}

成功后，我将使用 cmets 加载该 div：

$("#comments_ticket_div").load( "<?php echo $_SERVER['REQUEST_URI'];?> #comments_ticket_div" );

还有带有查询的 div 以获取该评论的所有 img：

$('#refresh-gallery').load("/.../.../.../edit-ticket2.php?id=<?php echo $id;?> #refresh-gallery");

由于此代码，所有 cmets 的加载工作正常，并且图像名称正确显示（正确的图像数量及其名称），但不适用于最后一条评论。最后一条评论显示所有图像，但它应该只显示属于最后添加的评论的那些图像（如上面的 queryx 所示）。

【问题讨论】：

如果图片和其他数据都在客户端，你可以尝试在 JS 中创建最后一条评论，不要使用后端。它也会更快。
是的，我明白了，但我需要使用这种方法：/

标签： php jquery mysql ajax dropzone

【解决方案1】：

这已解决...在上面给出的示例中，我正在加载#cmets_ticket_div，然后在代码中我试图加载#cmets_ticket_div 内部的#refresh-gallery div - 不知何故造成了问题。

对于解决方案，我删除了 #refresh-gallery div 的加载，并在 Dropzone .on 成功函数中应用了 #cmets_ticket_div 的加载。

myDropzone.on("success", function (file) {
    $('#comments_ticket_div').load("/../../../edit-ticket2.php?id=<?php echo $id;?> #comments_ticket_div");
});

【讨论】：