AJAX更改表格行點擊註釋

我目前正在開發一個Web應用程序，演示如何在ASL中「簽名」不同的單詞。左側有一個條目列表，右側有一個視頻和評論部分。AJAX更改表格行點擊註釋

見截圖在這裏：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匹配，所以這不是問題，我只需要它即時執行。

這裏是我的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) { 
       } 
      }); 
     }); 
    });

我在做什麼錯？我錯過了什麼嗎？

在此先感謝。

來源

2015-06-17 user2985455

這是一個錯誤？：''$ _POST ['rowID'];' – Rasclatt

你實際上並沒有做與頁面的任何一次，它歸還給你

success: function(msg) { 
}

當AJAX成功完成裏面的代碼此功能將執行，無論是通過返回的頁面會裏的msg PARAM。

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

這將完全替換具有id="comments-container"與AJAX請求返回任何元素（一個或多個）中的內容。

您可能會正確閱讀jQuery AJAX文檔頁面並研究一些示例。 http://api.jquery.com/jquery.ajax/

一旦你修好了，你會遇到一個問題，它仍然不會改變，這是因爲你沒有發送格式正確的POST數據。

data: rowID,

爲了訪問喜歡你的POST數據試圖（以$ _ POST [關鍵]）POST數據也需要在鍵值對。

data: "rowID=" + rowID,

閱讀關於$ _POST superglobal的PHP手冊頁的評論，以便更好地理解這一點。 http://php.net/manual/en/reserved.variables.post.php

編輯：哦，如果你打算將這個網站發佈給公衆，你可能想看看SQL注入以及如何強化你的網站。按照現狀，這很容易被破解，數據庫也會受到影響。

來源

2015-06-17 04:33:03 Verox

非常感謝您的幫助。這是最終工作的代碼：成功：函數（msg）{（「＃comments」）。html（$（「＃comments」，$（msg））。HTML（））; } 但是，現在我遇到了另一個問題。似乎輸入這個JavaScript已經打破了我的其他JavaScript的一些。單擊評論旁邊的「X」現在不再觸發javascript代碼以刪除該特定評論。此外，似乎每當我點擊「編寫評論」時，textarea就不再像以前那樣出現了。這兩個Jquery/JS是衝突的嗎？ – user2985455

也許我應該多說明一點：當頁面第一次加載時，如果我選擇寫或刪除評論，我可以成功地做到這一點。但是，只要我選擇一個新術語並且評論動態更新，我就不能再發表評論或刪除評論。 – user2985455

@ user2985455我會冒險猜測你在更新容器時意外替換了一些處理這些函數的javascript。不過，如果您在單獨的問題中提出這個問題，最好是這樣，因爲它可以幫助有類似問題的人在未來尋找答案。此外，如果這個答案幫助你不要忘記標記爲最佳答案:) – Verox

AJAX更改表格行點擊註釋

回答

相關問題