action属性なしでjQueryとAjaxのを使用してフォームをSubmiting

Question

これはループ

<?php 
        $sql=mysqli_query($dbconfig,"SELECT * FROM faq ORDER BY faqID DESC"); 
        while($faqList=mysqli_fetch_assoc($sql)){ 
        ?> 
      <form id="myForm" action="#" method="post" enctype="multipart/form-data"> 
      <input type="hidden" id="xAction" name="xAction" value="answerQ"> 
      <input type="hidden" id="faqID" name="faqID" value="<?php echo $faqList['faqID']; ?>"> 
      <textarea class="form-control" id="answer" name="answer" placeholder="Answer to this question" ></textarea> 
      <input id="submit" type="submit" value="Answer" class="btn btn-success btn-sm btn-rect"></form> 
      <?php } ?> 

これは私のAjaxコード

<script> 
    $("#submit").click(function() { 
       var faqID= $("#faqID").val(); 
       var answer= $("#answer").val(); 
       var xAction= $("#xAction").val(); 
       $.ajax({ 
        type: "POST", 
        url: "insertData.php", 
        data: 'faqID=' + faqID+ '&answer=' + answer+' & xAction=' + xAction, 
        success: function(result) { 
         alert(result); 
        } 
       }); 


      }); 
    </script> 

であり、これは

if($_REQUEST['xAction'] == 'answerQ'){ 
    $faqID = ($_REQUEST['faqID']); 
    $answer = ($_REQUEST['answer']); 
    $sql = "UPDATE faq SET answer='".$answer."' WHERE faqID = '".$faqID."'"; 
    $res = mysql_query($sql) or die(mysql_error()); 
    if($res){ 
     header('location:faqList.php?faqID='.$faqID.''); exit; 
     } 
} 

私inserData.phpファイルである間に、私のフォームです

私はデータベースにデータを挿入するためにajaxを使用したいが、それはまったく動作しないが、それは私がそうしなければならない場合、私はajaxを使用しないでデータを挿入して実行する必要があった場合でもそれを行うことができます。

Answer 1

スクリプトに多すぎるエラーがあります。すべての

まず、あなたはwhileループでフォームを作成している場合、ドキュメントは、idは一意である必要があり、同じ名前の複数のid属性を持つことができないか、クラスを使用することができます。

jsでは、送信されている特定のフォームからデータを取得する必要があります。 PHPスクリプトで

<script> 
$("input[type='submit']").click(function(e) { 
      e.preventDefault();  //prevent form to submit 
      var formData= $(this).closest('form').serialize();  //fetch form data 
      $.ajax({ 
       type: "POST", 
       url: "insertData.php", 
       data: formData, 
       success: function(result) { 
        alert(result); 
       } 
      }); 


     }); 
</script> 

あなたはAjaxでデータを提出しているとき、あなたはリダイレクトユーザーのためのヘッダーを使用することはできません、あなたは

success: function(result) { 
       alert(result); 
       window.location = "page.php"; 
      } 

を使用することができ、それはあなたを助けることを願っています！