Question

我真的需要你的帮助，因为我是php和Ajax的初学者。我的问题是，我无法通过 post.php 中的附加表单在数据库中发送数据，当id #reply 的按钮点击时，它会发送空数据到数据库刷新页面。当按下回复链接时，我只会显示回复结果链接，而不显示其他信息（姓名和评论）。我需要你的帮助才能使我的appanded表单能够在不刷新页面的情况下向数据库添加/发送数据，我还需要从 index.php 禁用表单以在回复按钮时进行回复/链接被按下。谢谢。

post.php中

<?php      include("config.php"); //inserting
$action=$_POST["action"];
 if($action=="addcomment"){
      $author = $_POST['name'];
      $comment_body = $_POST['comment_body'];
      $parent_id = $_POST['parent_id'];
  $q = "INSERT INTO nested (author, comment, parent_id) VALUES ('$author', '$comment_body', $parent_id)";
  $r = mysqli_query($conn, $q);
if(mysqli_affected_rows($conn)==1) { header("location:index.php");}
else { }
}   
// showing data  
error_reporting( ~E_NOTICE ); 
function getComments($conn, $row) {
$action=$_POST["action"];
 if($action=="showcomment"){  $id = $row['id'];
    echo "<li class='comment'><div class='aut'>".$row['author']."</div><div class='comment-body'>".$row['comment']."</div>";
    echo "<a href='#comment_fo' class='reply' id='".$row['id']."'>Reply</a>";
$result = mysqli_query($conn, "SELECT * FROM `nested` WHERE parent_id = '$id' ORDER BY `id` DESC"); 
}
if(mysqli_num_rows($result)>0) { echo "<ul>";
    while($row = mysqli_fetch_assoc($result)) { getComments($conn,$row);        }
      echo "</ul>"; } echo "</li>";
}   
 if($action=="showcomment"){
$q = "SELECT * FROM nested WHERE parent_id = '".$row['id']."' ORDER BY `id` DESC";
$r = mysqli_query($conn, $q);
   while($row = mysqli_fetch_assoc($r)){ getComments($conn,$row); }
}
?>
<!DOCTYPE HTML><head><script type='text/javascript'>
$(document).ready(function(){
    $("a.reply").one("click", function() {
        var id = $(this).attr("id");
        var parent = $(this).parent();
      $("#parent_id").attr("value", id);
parent.append(" <br /><div id='form'><form><input type='text' name='name' id='name'><textarea name='comment_body' id='comment_body'></textarea><input type='hidden' name='parent_id' id='parent_id' value='0'><button id='reply'>Reply</button></form></div>");  
     $("#reply").click(function(){
        var name=$("#name").val();
        var comment_body=$("#comment_body").val();
        var parent_id=$("#parent_id").val();
           $.ajax({
                 type:"post",
                 url:"post.php",
                 data:"name="+name+"&comment_body="+comment_body+"&parent_id="+parent_id+"&action=addcomment",
                    success:function(data){ showComment(); }
                 });
              });
     });        
 });
 </script></head></html>

//的index.php

<html><head><script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function showComment(){
    $.ajax({
       type:"post",
       url:"post.php",
       data:"action=showcomment",
           success:function(data){ $("#comment").html(data); }
         });
   }
  showComment();
$(document).ready(function(){
   $("#button").click(function(){
        var name=$("#name").val();
        var comment_body=$("#comment_body").val();
        var parent_id=$("#parent_id").val();
           $.ajax({
                 type:"post",
                 url:"post.php",
                 data:"name="+name+"&comment_body="+comment_body+"&parent_id="+parent_id+"&action=addcomment",
                    success:function(data){
                 showComment();             
                     }
                 });
             });
});
</script></head><body>
<form id="form_comment">
  <input type="text" name="name" id='name'/>
  <textarea name="comment_body" id='comment_body'></textarea>
  <input type='hidden' name='parent_id' id='parent_id' value='0'/>
  <input type="button" id="button" value="Comment"/>
</form>
<div id="comment"></div> </body></html>

Answer 1

$(document).ready(function(){
  $("#button").click(function(e){
      e.preventDefault();  //add this line to prevent reload
      var name=$("#name").val();
      var comment_body=$("#comment_body").val();
      var parent_id=$("#parent_id").val();
      $.ajax({
             type:"post",
             url:"post.php",
             data:"name="+name+"&comment_body="+comment_body+"&parent_id="+parent_id+"&action=addcomment",
                success:function(data){
             showComment();             
                 }
             });
         });
});

Answer 2

这是一个简单的不完整的 ajax示例。

FromPage.php

这是我使用的ajax。可以随意设置变量。

<script type="text/javascript">
        var cars = ["Saab", "Volvo", "BMW"];
        var name = "John Smith";

        $.ajax({
                url: 'toDB.php',
                type: 'post',
                dataType: 'html',
                data: {
                        carArray: cars, 
                        firstName: name 
                },
                success: function(data) {
                        console.log(data); //Testing
                }
        });

</script>

toDB.ph

这是第二页 - 将值写入数据库等的页面。

<?php
    $cars = $_POST['carArray'];
    $FirstName=$_POST['firstName'];

    //Used to test - it will print out the array
    print("<pre>");
    print_r($cars);
    print("</pre>");

    //Do something with $cars array and $FirstName variable
?>

如何在没有页面刷新的情况下使用ajax和php插入数据

2 个答案:

FromPage.php

toDB.ph