AJAX 更改表格行点击注释

Question

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

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

每当单击新术语时，我都在努力让 cmets 使用 AJAX 进行更改。目前，在选择新术语时，cmets 保持不变。如何使用AJAX进行若要更改注释部分以在选择新术语时更新？

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

这是我在 index.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) {
                }
           });
       });
    });

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

提前致谢。

Answer 1

页面返回给您后，您实际上并没有对页面进行任何操作

success: function(msg) {
}

当 ajax 成功完成后，该函数内的代码将执行，页面返回的任何内容都将在 msg 参数内。

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

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

您可能会正确阅读 jQuery AJAX 文档页面并学习一些示例。 http://api.jquery.com/jquery.ajax/

一旦你解决了你会遇到仍然不会改变的问题，这是因为你没有发送格式正确的 POST 数据。

data: rowID,

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

data: "rowID=" + rowID,

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

编辑：哦，如果你打算向公众发布这个网站，你可能想看看 SQL 注入以及如何强化你的网站来对抗它。就目前而言，这很容易被攻破，您的数据库也会受到损害。