AjaxとjQueryを使ったポストフォーム

Question

Ajax（とjQuery）の学習を開始すると、自分で解決できないポストフォームデータの問題が発生します。

まず、ここではそれを投稿、私はデータを収集する簡単な例であり、新しいページに表示される：

<!-- index.html --> 
<form id="myForm" action="test.php" method="post"> 
<input type="checkbox" id="ch1" name="Ch1" value="1">Check Box 1 <br /> 
<input type="checkbox" id="ch2" name="Ch2" value="2">Check Box 2 <br /> 
<input type="submit" id="myButton" /> 
</form> 

<?php 
// test.php 
print_r($_POST); 
?> 

その後、私はAjaxとjQueryを使ってみました。

<!-- index.html --> 
<form id="myForm"> 
<input type="checkbox" id="ch1" name="Ch1" value="1">Check Box 1 <br /> 
<input type="checkbox" id="ch2" name="Ch2" value="2">Check Box 2 <br /> 
<input type="button" id="myButton" value="Submit"/> 
</form> 

そしてここでjQueryの関数である：私は少し上に貼り付け、フォームが変更

// script.js 

$(document).ready(function() { 
    $("#myButton").click(function() { 
     $.ajax({ 
      cache: false, 
      type: 'POST', 
      url: 'test.php', 
      data: $("#myForm").serialize() 
     }); 
    }); 
}); 

私の質問はtest.phpタブに結果をエコーするためにjQueryの機能を再実装する方法、ありますか？私は多くのリソースをクロールしましたが、私は解決策を見つけることはできませんでした。

ありがとうございます。

ベスト、アンドレイ

Answer 1

私はあなたが.ajaxオプションパラメータでsuccessを探していると信じています。あなたは、私はいくつかのHTMLになりますと仮定しますsuccessコールバックを、必要になるだろう

$.ajax({ 
    ... 
    success: function(d){ 
    alert(d); 
    } 
}); 

Answer 2

...

$(document).ready(function(){ 
    $("#myButton").click(function() { 
     $.ajax({ 
     cache: false, 
     type: 'POST', 
     url: 'test.php', 
     data: $("#myForm").serialize(), 
     success: function(response) { 
      $("#someElement").html(response); 
     } 
     }); 
    }); 
}); 

Answer 3

はこれを試してみてください。

$(document).ready(function(){ 
    $("#myButton").click(function() { 
     $.ajax({ 
     cache: false, 
     type: 'POST', 
     url: 'test.php', 
     data: $("#myForm").serialize(), 
     success: function(data){ 
     alert(data); 
     } 
     }); 
    }); 
});