フォームデータをjavascriptで取得し、ajaxを使用してPHPファイルに送信します

Question

フォームからajax経由で投稿する方法を調べる際に問題があります。私は次のコードを持っていますが、チェックボックスやラジオボタンのような要素からデータを送信しているようには見えません。代わりにすべてのフィールドを送信しています。つまり、ラジオボタンのセットがある場合は、チェックされたものだけでなく、すべての可能性を送信しています。フォームはどのタイプの要素で構成されていてもよく、その中に要素が壊れているので、私の方法で繰り返し処理する必要があります。その部分は機能しているようですが、JavaScriptを使って選択したデータを取得することはできません。各要素のタイプを手動でチェックして、それがチェックされているかどうかを確認する必要がありますか？

myString = ""; 
my_form_id = "1"; 
my_url = "phpscript.php"; 
elem = document.getElementById("form_" + my_form_id).elements; 
for(var i = 0; i < elem.length; i++) 
{ 
    if (i>0) { myString += "&"; } 
    myString += elem[i].name + "=" + elem[i].value; 
} 
$.ajax({ 
type: "POST", 
url: my_url, 
data: myString, 
success: function(data) { 
// process the post data 
} 
}); 

`

Answer 1

あなたはjQueryのを使用しているので、あなたは大幅にそれをすべてを簡素化することができます：

var my_form_id = "1"; 
var my_url = "phpscript.php"; 
var form = $("#form_" + my_form_id); 

$.ajax({ 
    type: "POST", 
    url: my_url, 
    data: form.serialize(), 
    success: function(data) { 
     // process the post data 
    } 
}); 

jQueryのserialize方法はあなたのためにすべての作業を行います。しかし、手でそれをやりたければ、それぞれのフィールドをチェックする必要があります。