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

时间:2013-08-18 16:17:12

标签: php html validation radio

我面对一个我无法弄清楚的奇怪错误。我有一个表格提交了一组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;
}

1 个答案:

答案 0 :(得分:3)

在此我们需要知道单选按钮的工作原理。

单个组中的所有单选按钮将共享相同的名称。

在您的情况下 - 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();
    }

});