單選按鈕在提交後返回相同的值

Question

我正面臨着一個我無法弄清楚的奇怪錯誤。我有一個提交了一組2個單選按鈕1名男等女像這樣的形式：

<label class="radio"> 
    <input type="radio" name="gender" id="femaleRadio" value="f"> 
    Vrouw 
</label> 
<label class="radio"> 
    <input type="radio" name="gender" id="maleRadio" value="m"> 
    Man 
</label> 

通過jQuery的AJAX我將它發送到PHP ...但是當我echo後它總是顯示，男性選擇。即使我選擇了女性。爲什麼是這樣？

$gender = strip_tags(trim($_POST['gender'])); 
echo $gender; exit; 

我總是M.如果我刪除HTML中的男性的選擇，我得到F.這必須有一個簡單的解決方案，但我不能找到它。

這裏是一段JavaScript代碼在那裏我得到表單中的所有數據

var el = $(this), 

url = el.attr('action'), 
type = el.attr('method'), 

data = {} 

// The loop to get al form data 
el.find('[name]').each(function(index, value) { 

    var el = $(this) 
    name = el.attr('name'), 
    value = el.val(); 

    //make data object 
    data[name] = value; 

}); 

在單選按鈕上的驗證提交

//Do some client side validation first 
if (!$("#femaleRadio").prop("checked") && !$("#maleRadio").prop("checked")) { 

    //Check if radio button is selected 
    $('#regError').html("<strong>Fout: </strong> Selecteer een geslacht"); 
    $('#regError').fadeIn(); 
    return false; 
} 

Answer 1

在這一點，我們需要知道如何單選按鈕的作品。

在單個組中的所有單選按鈕將共享相同的名稱。

在你的情況 - gender。

所以，當我們選擇任意一個選項，並提交表單，則只有選定的單選按鈕的值存儲在gender。

但是按照你寫的的JavaScript/jQuery代碼，你只是考慮每個元素的值，並把它作爲它的名字的價值。

在這種情況下，你不檢查任何單選按鈕是否被選中與否。

你可以試試下面的代碼

data['gender'] = $('[name=gender]:checked').val(); 

如果沒有選擇 - 在gender屬性將是不確定的。

您可以根據需要更改此邏輯。

從它似乎是代碼，你迭代所有可用的字段名。在這種情況下，您可以更新，像這樣

// The loop to get al form data 
el.find('[name]').each(function(index, value) { 

    var el = $(this) 
    name = el.attr('name'), 
    value = el.val(); 

    //make data object 
    data[name] = value; 

    //If this element is a radio button 
    if($(this).is(':radio')) { 
     data[name] = $('[name=' + name + ']:checked').val(); 
    } 

});