繁体   English   中英

Ajax评论未重新提交

ajax comment not re submiting

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

大家好。 我的代码工作得很好,但是问题是,当我更改输入字段的值时,它不会将新数据提交到服务器,而是将旧数据重新提交到服务器,这回显了。 仅在刷新页面后才提交Nww输入。 Wihich击败了使用Ajax的最初目的。 请有人指出正确的方向。 提前致谢。 这是我的代码。

<link rel="stylesheet" href="comment.css">
<div class="l-com" id="l-com">
    <a class="clickComment" href="#">Leave a comment</a>
</div>
<div class="comment-container">
    <p>
       <input type="text" placeholder="Enter your name" id="name">
    </p>
    <p>
        <input type="text" placeholder="Enter your email" id="email">
    </p>
    <p>
       <textarea id="comment" placeholder="Write your comment" rows="7"> 
       </textarea>
    </p>
    <p>
       <button type="submit" id="submitBtn" 
       onclick="showComment();">Post</button>           
    </p>

    </div>
  <div id="comment-result">  
  </div>

的JavaScript

    var name = document.getElementById('name').value,
    email = document.getElementById('email').value,
    comment = document.getElementById('comment').value,
    pageUrl = window.location.href,
    lastFsl = pageUrl.lastIndexOf('/'),
    partUrl = pageUrl.substring(lastFsl + 1),
    addrDot = partUrl.indexOf('.'),
    pageLocation = partUrl.substring(0, addrDot),
    webpage = pageLocation.replace(/-/g, '_'),
    leaveAcomm = document.querySelector('.clickComment'),
    commentWrapper = document.querySelector('.comment-container'),
    submitBtn = document.getElementById('submitBtn'),
    request = new XMLHttpRequest(),

    parameters = 'name=' + encodeURIComponent(name) + 
          '&email=' + encodeURIComponent(email) +
          '&comment=' + encodeURIComponent(comment) + 
          '&webpage=' + encodeURIComponent(webpage);

          leaveAcomm.addEventListener('click', ChangeDisplay);
          function ChangeDisplay() {
              elDisplay = commentWrapper.style.display;
              if(elDisplay === 'block') {
                  commentWrapper.style.display = 'none';
              }else {
                  commentWrapper.style.display = 'block';
              }
          }


    function showComment() {
        request.open('POST','comment.handler.php', true);
        request.setRequestHeader('Content-Type', 'application/x-www-form- 
        urlencoded');

        request.onreadystatechange = function () {
        if(request.readyState == 4 && request.status == 200) {
            var commentResult = document.getElementById('comment-result');
            commentResult.innerHTML = request.responseText;
            console.log(request.responseText);
       }

    }

    request.send(parameters);   
}
//php code comment.handler.php

<?php
$name = $_POST['name'];
$email = $_POST['email'];
$comment = $_POST['comment'];
$table = $_POST['webpage'];
$date = time();


//connect to the database 

$servername = 'localhost';
$username = 'root';
$password = '';
$db = 'commdb';

    $conn = mysqli_connect($servername, $username,$password, $db);
   if(!$conn) {
       die('could not connect ' . mysqli_connect_error($conn));
   }
$checkTable = "SELECT 1 FROM $table";
$chkTblRun = mysqli_query($conn, $checkTable);
if($chkTblRun !== FALSE) {
    if(!empty($name) && !empty($comment) && !empty($email)){
        $insertComment = "INSERT INTO $table(posterName, email, comment, 
         commentDate) 
         VALUES ('$name', '$email', '$comment', '$date')";
         $insertComRun = mysqli_query($conn, $insertComment);
         $selAll = "SELECT * FROM $table ORDER BY ID DESC";
         $selAllRun = mysqli_query($conn, $selAll);
         while($rows = mysqli_fetch_assoc($selAllRun)) {
            $name_field = $rows['posterName'];
            $comment_field = $rows['comment'];
            $postDate = $rows['commentDate'];

            echo '<section id="commResults">' . '<div id="postName">' . 
            $name_field . 
            '</div>'. '<div id="commenter">' . $comment_field . '</div>' .
            '</section>';
         }
    }
  } else {
        $createTable = "CREATE TABLE $table (" .
        "ID INT NOT NULL AUTO_INCREMENT," .
        "posterName VARCHAR (50) NOT NULL," .
        "email VARCHAR (50) NOT NULL," .
        "comment TEXT NOT NULL," .
        "commentDate TEXT NOT NULL," .
        "PRIMARY KEY (ID)" . 

        ")";

      $crtTblRn = mysqli_query($conn, $createTable);
      if(!$createTable) {
      echo 'could not create table ' . mysqli_error($conn);
     } else {
            if(!empty($name) && !empty($comment) && !empty($email)) {
            $insertComm = "INSERT INTO $table (posterName, email, comment, 
            commentDate)
            VALUES('$name', '$email', '$comment', '$date')";
            $insertComRun = mysqli_query($conn, $insertComm);
            $selAll = "SELECT * FROM $table ORDER BY ID DESC";
            $selAllRun = mysqli_query($conn, $selAll);
            while ($rows = mysqli_fetch_assoc($selAllRun)) {
                  $name_field = $rows['posterName'];
                  $comment_field = $rows['comment'];
                  $postDate = $rows['commentDate'];

                  echo '<section id="commResults">' . '<div id="postName">' . 
                  $name_field . 
                  '</div>' . '<div id="commenter">' . $comment_field . 
                  '</div>' .
                  '</section>';
             }
        }
      }
    }

?>

问题暂未有回复.您可以查看右边的相关问题.
1 AJAX表单提交未重新加载内容

我在这里看到了很多问题和答案,但似乎都无法解决我的问题。 我有一个表单,它是从ajax加载调用加载到名为dynamic-content的div类中的。 基本上,如果按下表单提交按钮,我希望它在ajax中重新加载此表单,以便进行php表单验证。 我的问题是,当提交发生时,我会调用ajax加载以通过ja ...

4 如何使用ajax向网站提交评论?

我知道我有一个非常愚蠢的问题,对初学者的愚蠢感到抱歉... 但是,是否有一种简单的方法来打开文本框,当用户单击时,将评论保存到数据库中,并且评论框缩小以消失? 这一定是一个简陋的简单教程,我只是没找到一个! 谢谢! ...

2010-11-16 03:43:05 1 40   html/ ajax
5 AJAX:表单提交以发表评论

我在获取表单提交并显示评论而不刷新页面(就地)时遇到问题,但是当我单击按钮时,它带我到页面顶部,但不执行任何操作,没有插入数据库,因此不会在页面中显示注释。 应该将注释放置在具有淡入淡出效果的适当位置。 脚本的鸣谢和演示: 原始脚本在这里 我在上面的链接中提供的脚本可以在尝试时 ...

6 防止评论表重新提交

我有一篇文章的评论表,我会阻止重新提交。 我注意到Worpdress处理得非常好(返回不会导致浏览器请求重新提交表单),但我无法弄清楚他们是如何做到的,即使我们的方法非常相似。 我的剧本 用户访问mydomain.com/article/1/article_title.html ...

8 在Ajax中成功提交评论后重新加载或刷新页面

成功提交评论后,我试图重新加载页面通过Ajax提交的评论 在这行之后 如果我正在尝试使用location.reload(); 如 那么它不起作用并且评论甚至都没有提交以下是完整的代码能否提供任何帮助-成功提交评论并将其存储在后端时如何刷新和加载页面 第二档 ...

9 Django、Ajax 和 JS。 当我提交评论时如何防止页面重新加载和跳转到页面顶部

我遵循了一个关于如何在不重新加载页面和跳转到页面顶部的情况下提交 Django 评论表单的解决方案。 我在线和离线尝试了许多解决方案,但仍然没有解决方案。 表单工作正常,唯一的问题是提交时页面重新加载。 我是 Django 后端和 Ajax 的新手,如果有人可以帮助解决这个问题,我会很高兴。 提 ...

10 遇到ajax提交重新加载问题,匿名函数未执行

我花了很多时间来寻找这个,也许我没有正确地解决这个问题,但是我试图在单击一个提交之后进行.submit和.post。 在其他情况下,我无需刷新即可使ajax提交正常工作,但是当我以这种方式进行操作时,它就无法正常工作。 我很好奇为什么。 形成 阿贾克斯 这有效,它将无需 ...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2021 STACKOOM.COM