AJAX 更改表行单击注释


AJAX change comment on table row click

我目前正在开发一个网络应用程序,演示如何在ASL中"签名"不同的单词。左侧有一个术语列表,右侧有一个视频和评论部分。

在此处查看屏幕截图:http://i917.photobucket.com/albums/ad19/brycematheson/Screen%20Shot%202015-06-16%20at%2010.05.36%20PM.png

每当单击新术语时,我都在努力使用 AJAX 更改注释。目前,注释与选择新术语时保持不变。我将如何使用 AJAX 更改注释部分以在选择新术语时进行更新?

我的评论部分看起来像这样。更新 PHP 中的$id_post=3部分将更改注释以将注释与数据库中的该 ID 匹配,所以这不是问题,我只需要它来即时完成。

这是我的索引.php页面中的注释代码:

<?php 
                // Connect to the database
                require_once('models/db-settings.php'); 
                $id_post = '$_POST['rowID']; //the post or the page id
                ?>
                <div class="cmt-container">
                    <?php 
                    $sql = mysqli_query($mysqli, "SELECT * FROM comments WHERE id_post = '$id_post' ORDER BY id ASC") or die(mysqli_error($mysqli));
                    while($affcom = mysqli_fetch_array($sql,MYSQLI_ASSOC)) {
                        $id = $affcom['id'];
                        $name = $affcom['name'];
                        $email = $affcom['email'];
                        $comment = $affcom['comment'];
                        $date = $affcom['date'];
                        // Get gravatar Image 
                        // https://fr.gravatar.com/site/implement/images/php/
                        $default = "mm";
                        $size = 35;
                        $grav_url = "http://www.gravatar.com/avatar/".md5(strtolower(trim($email)))."?d=".$default."&s=".$size;
                    ?>
                    <div class="cmt-cnt">
                        <img src="<?php echo $grav_url; ?>" />
                        <div class="thecom">
                            <h5><?php echo ucfirst($name); ?></h5><span data-utime="1371248446" class="com-dt"><?php echo $date; ?></span>
                            <br/>
                            <p>
                                <?php echo $comment; ?>
                            </p>
                            <div style="float:right;"><span class="action"><a href="#" id="<?php echo $id; ?>" class="delete" title="Delete">X</a></span></div>
                        </div>
                    </div><!-- end "cmt-cnt" -->
                    <?php } ?>

                    <div class="new-com-bt">
                        <span>Write a comment ...</span>
                    </div>
                    <div class="new-com-cnt">
                        <textarea class="the-new-com"></textarea>
                        <div class="bt-add-com">Post comment</div>
                        <div class="bt-cancel-com">Cancel</div>
                    </div>
                    <div class="clearfix"></div>
                </div>

还有我的Javascript:

 $('#matrix tr').click(function (event) {
      var rowID = ($(this).attr('id')); //trying to alert id of the clicked row          
    $(function(){
            e.preventDefault();
            $.ajax({
                type: 'POST',
                url: 'index.php', 
                data: rowID,
                success: function(msg) {
                }
           });
       });
    });

我做错了什么?我错过了什么吗?

提前谢谢。

一旦页面返回给您,您实际上并没有对页面执行任何操作

success: function(msg) {
}

当 ajax 成功完成时,此函数中的代码将执行,页面返回的任何内容都将位于msg参数中。

success: function(msg) {
    $('#comments-container').html(msg);
}

这将完全替换id="comments-container"的元素的内容与返回的任何 ajax 请求。

您可以正确阅读jQuery AJAX文档页面并研究一些示例 http://api.jquery.com/jquery.ajax/。

一旦你修复了你会遇到一个问题,

它仍然不会改变,这是因为你没有发送格式正确的POST数据。

data: rowID,

为了像您尝试的那样访问 POST 数据(使用 $_POST[key]),POST 数据还需要在键值对中。

data: "rowID=" + rowID,

阅读 PHP 手册页上的 $_POST 超全局注释,以便更好地理解这一点。 http://php.net/manual/en/reserved.variables.post.php

编辑:哦,如果你打算向公众发布这个网站,你可能想看看SQL注入以及如何强化你的网站。就目前而言,这将很容易被破解并且您的数据库受到损害。