AJAX .done（）が期待通りに動作しない

Question

問題がどこにあるのか分かりませんが、この行を変更した場合、data: form_dataからdata: form_data;にはAjaxが返されませんが、PHP関数が動作します。ラインと

デフォルトアヤックス、： - ";" data : form_data>改ページとPHPの関数が

が追加動作しません。その行の後data : form_data; - >何も表示されますが、PHPの関数は、データベースに "返信" を動作し、挿入PHP関数を呼び出し、ここのような警告ダイアログが表示されているはずです

：

返信フォーム：

<!-- REPLY MODAL --> 
<div class="modal fade reply_comment_<?php echo $comment['id'];?>" id="reply_comment_<?php echo $comment['id'];?>" tabindex="-1" role="dialog" aria-hidden="true"> 
    <div class="modal-dialog modal-lg"> 
     <div class="modal-content"> 
      <b><center><div class="modal-header">Reply Comment</div></center></b> 
      <form id="replyForm_<?php echo $comment['id'];?>" class="horiziontal-form" action="../Pages/fun_post.php?action=replyCommentForm" method="post"> 
       <center><textarea name="reply" style="width:80%; height:200px; margin-top:20px; margin-bottom:20px; resize:vertical;" placeholder="Write your comment!"></textarea></center> 
       <input type="hidden" name="addedby" class="form-control col-md-7 col-xs-12" value="<?php echo $myRow['id']; ?>" /> 
       <input type="hidden" name="comment_id" class="form-control col-md-7 col-xs-12" value="<?php echo $comment['id']; ?>" /> 
       <input type="hidden" name="post_id" class="form-control col-md-7 col-xs-12" value="<?php echo $comment['post_id']; ?>" /> 
       <input type="submit" style="float:right; margin-right:90px;" class="btn btn-primary" name="submit" value="Reply" /> 
      </form> 
     </div> 
    </div> 
</div> 
<!-- END OF REPLY MODAL --> 

スクリプト：

<script> 
$(function(){ 
    $("#reply_comment_<?php echo $comment['id'];?>").submit(function(event){ 
     event.preventDefault(); //prevent default action 
     var post_url = $(this).attr("action"); //get form action url 
     var request_method = $(this).attr("method"); //get form GET/POST method 
     var form_data = $(this).serialize(); //Encode form elements for submission 

     $.ajax({ 
      url : post_url, 
      type: request_method, 
      data : form_data 
     }).done(function(response){ // 
      $('#reply_comment_<?php echo $comment['id'];?>').modal('hide'); 
      document.getElementById('result-box').innerHTML += response; 
     }); 
    }); 
}); 
</script> 

WORKING例 "REPORTのPOSTフォーム" USING SAME CODINGあなたのイベントハンドラを提出フォームの間違った選択を使用している表示されます

<!-- REPORT MODAL --> 
<div class="modal fade report_post_<?php echo $post['id'];?>" id="report_post_<?php echo $post['id'];?>" tabindex="-1" role="dialog" aria-hidden="true"> 
    <div class="modal-dialog modal-lg"> 
     <div class="modal-content"> 
      <b><center><div class="modal-header">Report Post</div></center></b> 
      <form id="reportForm_<?php echo $post['id'];?>" class="horiziontal-form" action="../Pages/fun.php?action=reportPostForm" method="post"> 
       <center><textarea name="report" style="width:80%; height:200px; margin-top:20px; resize:vertical;" placeholder="Please describe your Report!"></textarea></center> 
       <input type="hidden" name="addedby" class="form-control col-md-7 col-xs-12" value="<?php echo $myRow['id']; ?>" /> 
       <input type="hidden" name="image_id" class="form-control col-md-7 col-xs-12" value="<?php echo $post['id']; ?>" /> 
       <div class="modal-footer"><input type="submit" class="btn btn-danger" name="submit" value="Report" /></div> 
      </div> 
     </div> 
    </form> 
</div> 
<!-- END OF REPORT MODAL --> 


<script> 
$(function(){ 

    $("#reportForm_<?php echo $post['id'];?>").submit(function(event){ 
     event.preventDefault(); //prevent default action 
     var post_url = $(this).attr("action"); //get form action url 
     var request_method = $(this).attr("method"); //get form GET/POST method 
     var form_data = $(this).serialize(); //Encode form elements for submission 

     $.ajax({ 
      url : post_url, 
      type: request_method, 
      data : form_data 
     }).done(function(response){ // 
      $('#report_post_<?php echo $post['id'];?>').modal('hide'); 
      document.getElementById('result-box').innerHTML += response; 
     }); 
    }); 
    }); 
</script> 

Answer 1

。あなたは、使用している：

$("#reply_comment_<?php echo $comment['id'];?>").submit(function(event){ 
    // ... 
}); 

しかしreply_comment_<?php echo $comment['id'];?>がモーダル（すなわちdiv要素）のIDです。 docs：

送信イベントは、ユーザーがフォームを送信しようとしたときに要素に送信されます。それは<フォーム>の要素にのみ添付することができます。

フォームのIDは、あなたがその代わりに使用する必要がありますreplyForm_<?php echo $comment['id'];?>です：

$("#replyForm_<?php echo $comment['id'];?>").submit(function(event){ 
    // ... 
});