(jQuery)ラジオボタン選択値を配列で送信

質問

ちょっと前に別の方の同名の質問があり、正しい回答が出る前に、例によって不適切な回答で閉め切られてしまったため、失礼とは存じますが改めて質問させていただきます。

<form id="enqe" action="/hoge/enqe" method="post">

<label for="group_a">好きなフレームワーク</label>
<input type="radio" name="group_a" value="a1">cake php</input>
<input type="radio" name="group_a" value="a2">fuel php</input>
<input type="radio" name="group_a" value="a3">symphony</input>

<label for="group_b">使っているOS</label>
<input type="radio" name="group_b" value="b1">windows</input>
<input type="radio" name="group_b" value="b2">macintosh</input>
<input type="radio" name="group_b" value="b3">linux</input>

<label for="group_c">使っているCPU</label>
<input type="radio" name="group_c" value="c1">ivy bridge</input>
<input type="radio" name="group_c" value="c2">sandy bridge</input>

</form>

のような選択肢があって、選択値を配列で送信したいです。

配列で受けたい理由は、送信側のフォーム（項目、グループ分け）が逐次追加変更される予定で、それに合わせてDBだけを変更して対応したいからです。
したがって、「毎度サーバサイドで対応しろ」という回答は困ります。

<input type="hidden" name="gval[]" value="a1" />
<input type="hidden" name="gval[]" value="b2" />
<input type="hidden" name="gval[]" value="c3" />

という内容を生成して送信すればいいのはわかりますが、どう記述したらいいかがわかりません。

いちおうjQueryで、

$('form#enqe').submit(function(){
// $(this).find("input[type='radio']"); で、<input type="radio">を取得
});

まではわかりましたが、jQueryに疎く、その先がわかりません。
識者の方々のお力をお借りできれば幸いです。

回答No.2

nekomikekamo · ベストアンサー

通常版で書き換えてみました。

jQuery('#enqe').submit(function(){
var that = this;
jQuery('input[type="radio"]:checked','#enqe').each(function(i){
$("<input>").attr({
'type':'hidden',
'name':'hoge['+i+']'
}).val(jQuery(this).val()).appendTo(that);
});
return true;
});

お礼

これです、これです！

丁寧にも、
<input type="hidden" name="hoge[0]" value="a1"/>
<input type="hidden" name="hoge[1]" value="b1"/>
<input type="hidden" name="hoge[2]" value="c1"/>
とかになってます。サーバによっては、こうじゃないとうまく転送値を配列として判定できないものもあるようで。

本当に有難うございます（別件のご回答も含めて）厚く御礼申し上げます。

回答No.1

nekomikekamo

sendデータを作ってあげこんな感じですかね？
'hoge[]'が配列していです。

jQuery('#enqe').submit(function(){
var sendData = [];
jQuery('input[type="radio"]:checked','#enqe').each(function(){
sendData[sendData.length] = jQuery(this).val();
});

jQuery.post(jQuery('#enqe').attr('action'), { 'hoge[]': sendData });
return false;
});

補足

回答いただきありがとうございます。

なるほど。。Ajaxではそんな風に遷移するのですね。。
全く申し訳ないのですが、今回、サーバサイドの事情で、Ajaxを使った更新ではなく、通常のsubmitで遷移したいのです。
説明が悪くて申し訳ありません。

ひきつづき、アドバイスなどありましたらよろしくお願いします。