单选按钮在提交后返回相同的值

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(); 
    } 

});