php - データを追加してコメントを書くコメントを繰り返す

Question

私は問題があります

3 つの投稿を追加すると、投稿番号 2 のコメントにコメントを書き、繰り返します。

もっとはっきりさせる

3記事追加したら

ポスト1 =

ポスト 2 = b

ポスト 3 = c

投稿 2 にコメントを書きます。このコメントは、繰り返しお願いします。

この写真のように

これはファイルです

index.php

<? include("../post/includes/config.php"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <script type="text/javascript" src="jquery.js"></script>
      <script type="text/javascript">
        $(function(){
          $("#update_state").submit(function(){
            var text = $(".text") .val();
            var s = {
              "text":text
            }
            $.ajax({
              url:'action.php',
              type:'POST',
              data:s,
              cache: false,
              beforeSend: function (){
                $(".loading") .show();
                $(".loading") .html("loading...");
              },
              success:function(html){
                $("#show_new_posts") .prepend(html);
                $(".loading") .hide();
                $(".text") .val("");
              }
            });
          return false;
          });

          //add comment

          $(".comment_form").submit(function(){
            var id_post = $(this).attr('rel');
            var text_comm  = $(".commtext[rel="+id_post+"]") .val();
            var s = {
              "id_post":id_post,
              "text_comm":text_comm
            }
            $.ajax({
              url:'add_comment.php',
              type:'post',
              data:s,
              beforeSend: function (){
                $(".loadingcomm[rel="+id_post+"]") .show();
                $(".loadingcomm[rel="+id_post+"]") .html("<img src=\"style/img/ajax/load1.gif\" alt=\"Loading ....\" />");
              },
              success:function(html){
                $(".loadingcomm[rel="+id_post+"]").hide();
                $(".commtext[rel="+id_post+"]") .val("");
                $(".shownewcomm[rel="+id_post+"]").append(html);
              }
            });
          return false;
        });
      });
    </script>
  </head>
  <body>
    <form id="update_state">
      <textarea class="text" name="text"></textarea>
      <input type="submit" value="go" />
    </form>
    <div class="loading"></div>
    <div id="show_new_posts"></div>
<?
$select_posts = $mysqli->query("SELECT * FROM posts ORDER BY id DESC LIMIT  4 ");
$num_posts = $select_posts->num_rows;
if($num_posts){
  while ($rows_posts = $select_posts->fetch_array(MYSQL_ASSOC)){
    $id_posts             = $rows_posts ['id'];
    $post_posts           = $rows_posts ['post'];
?>
<div style="padding: 5px; margin: 5px; background:#ccc; width:300px;">
  <b>admin</b>
</div>
<div style="padding: 5px; margin: 5px; background:#ccc; width:300px;">
  <? echo $post_posts; ?>
</div>
<div class="shownewcomm" rel="<? echo $id_posts; ?>"></div>
<form rel="<? echo $id_posts; ?>" class="comment_form">
  <textarea rel="<? echo $id_posts; ?>" style="height: 20px;" placeholder="Comment.." class="commtext"></textarea>
  <input type="submit" value="comment" />
</form>
<hr />
<?
}
}
?>
</body>
</html>

action.php

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
  $(function(){

    $(".comment_form").submit(function(){

      var id_post = $(this).attr('rel');
      var text_comm  = $(".commtext[rel="+id_post+"]") .val();

      var s = {
        "id_post":id_post,
        "text_comm":text_comm
      }

      $.ajax({
        url:'add_comment.php',
        type:'post',
        data:s,
        beforeSend: function (){
          $(".loadingcomm[rel="+id_post+"]") .show();
          $(".loadingcomm[rel="+id_post+"]") .html("<img src=\"style/img/ajax/load1.gif\" alt=\"Loading ....\" />");
        },
        success:function(html){
          $(".loadingcomm[rel="+id_post+"]").hide();
          $(".commtext[rel="+id_post+"]") .val("");
          $(".shownewcomm[rel="+id_post+"]").append(html);
        }
      });

      return false;
    });

  });
</script>


<?php
include("../post/includes/config.php");
$text = $_POST['text'];

$insert = $mysqli->query("INSERT INTO posts (id, post) VALUE ('', '$text')");
$id_posts = $mysqli->insert_id;
if($insert){
  ?>
<div style="padding: 5px; margin: 5px; background:#ccc; width:300px;">
  <b>admin</b>
</div>
<div style="padding: 5px; margin: 5px; background:#ccc; width:300px;">
  <? echo $text; ?>
</div>
<div class="shownewcomm" rel="<? echo $id_posts; ?>"></div>
<form rel="<? echo $id_posts; ?>" class="comment_form">
  <textarea rel="<? echo $id_posts; ?>" style="height: 20px;" placeholder="Comment.." class="commtext"></textarea>
  <input type="submit" value="comment" />
</form>
<hr />
<?
}
?>

add_comment.php

<?php
$id_post = $_POST['id_post'];
$text_comm = $_POST['text_comm'];

?>
admin :  <? echo $text_comm;  ?>
<br />

score 0 · Accepted Answer

$(".comment_form").submitとがajax callありindex.phpますaction.php。そして、index.phpあなたはaction.phpこのような結果を前に付けています

$("#show_new_posts").prepend(html);

このため、複数になる可能性がありますajax call。JavaScriptからすべてのコードを削除しaction.phpて試してください

アップデート：

で行われた変更はaction.php次のとおりです。

jquery参照を削除し、最後index.phpに他のJSコードを移動しました
フォームに ID を追加しました

<form rel="<?php echo $id_posts; ?>" id="comment_form_<?php echo $id_posts; ?>" class="comment_form">
次のようにフォーム ID を使用するように送信ハンドラーを更新しました。

$("#comment_form_<?php echo $id_posts; ?>").submit(function(){

更新されaction.phpたコードは次のとおりです。

<?php
include("../post/includes/config.php");
$text = $_POST['text'];

$insert = $mysqli->query("INSERT INTO posts (id, post) VALUE ('', '$text')");
$id_posts = $mysqli->insert_id;
if ($insert) {
    ?>
    <div style="padding: 5px; margin: 5px; background:#ccc; width:300px;">
        <b>admin</b>
    </div>
    <div style="padding: 5px; margin: 5px; background:#ccc; width:300px;">
        <?php echo $text; ?>
    </div>
    <div class="shownewcomm" rel="<?php echo $id_posts; ?>"></div>
    <form rel="<?php echo $id_posts; ?>" id="comment_form_<?php echo $id_posts; ?>" class="comment_form">
        <textarea rel="<?php echo $id_posts; ?>" style="height: 20px;" placeholder="Comment.." class="commtext"></textarea>
        <input type="submit" value="comment" />
    </form>
    <hr />
    <script type="text/javascript">
        $(function() {

            $("#comment_form_<?php echo $id_posts; ?>").submit(function(){

                var id_post = $(this).attr('rel');
                var text_comm = $(".commtext[rel=" + id_post + "]").val();

                var s = {
                    "id_post": id_post,
                    "text_comm": text_comm
                }

                $.ajax({
                    url: 'add_comment.php',
                    type: 'post',
                    data: s,
                    beforeSend: function() {
                        $(".loadingcomm[rel=" + id_post + "]").show();
                        $(".loadingcomm[rel=" + id_post + "]").html("<img src=\"style/img/ajax/load1.gif\" alt=\"Loading ....\" />");
                    },
                    success: function(html) {
                        $(".loadingcomm[rel=" + id_post + "]").hide();
                        $(".commtext[rel=" + id_post + "]").val("");
                        $(".shownewcomm[rel=" + id_post + "]").append(html);
                    }
                });

                return false;
            });

        });
    </script>
    <?php
}
?>

php - データを追加してコメントを書く コメントを繰り返す

1 に答える 1

Related

Reference

php - データを追加してコメントを書くコメントを繰り返す