我有一堆默认选中的复选框。我的用户可能会取消选中一些复选框(如果有的话),并选中其余的复选框。

是否有任何方法使表单POST未选中的复选框,而不是选中的复选框?


当前回答

@cpburnz说对了,但是代码太多了,下面是使用更少代码的相同想法:

JS:

// jQuery OnLoad
$(function(){
    // Listen to input type checkbox on change event
    $("input[type=checkbox]").change(function(){
        $(this).parent().find('input[type=hidden]').val((this.checked)?1:0);
    });
});

HTML(注意字段名使用数组名):

<div>
    <input type="checkbox" checked="checked">
    <input type="hidden" name="field_name[34]" value="1"/>
</div>
<div>
    <input type="checkbox">
    <input type="hidden" name="field_name[35]" value="0"/>
</div>
<div>

对于PHP:

<div>
    <input type="checkbox"<?=($boolean)?' checked="checked"':''?>>
    <input type="hidden" name="field_name[<?=$item_id?>]" value="<?=($boolean)?1:0?>"/>
</div>

其他回答

最简单的解决方案是一个“虚拟”复选框加上隐藏输入,如果你正在使用jquery:

 <input id="id" type="hidden" name="name" value="1/0">
 <input onchange="$('#id').val(this.checked?1:0)" type="checkbox" id="dummy-id" 
 name="dummy-name" value="1/0" checked="checked/blank">

将两个输入的值设置为当前的1/0值,如果为1,则checked=checked。输入字段(活动)现在将始终被发布为1或0。此外,复选框可以在提交前点击多次,仍然可以正常工作。

复选框的问题是,如果它们没有被选中,那么它们就不会随表单一起发布。如果你选中一个复选框并提交一个表单,你将在$_POST变量中获得该复选框的值,你可以使用它来处理表单,如果它未选中,则不会向$_POST变量中添加任何值。

在PHP中,通常可以通过对复选框元素执行isset()检查来解决这个问题。如果你期望的元素没有在$_POST变量中设置,那么我们知道复选框没有被选中,值可以为false。

if(!isset($_POST['checkbox1']))
{
     $checkboxValue = false;
} else {
     $checkboxValue = $_POST['checkbox1'];
}

但是如果你创建了一个动态表单,那么你并不总是知道你的复选框的name属性,如果你不知道复选框的名称,那么你就不能使用isset函数来检查它是否与$_POST变量一起发送。

您不需要为所有复选框创建一个隐藏字段,只需复制我的代码。 它会改变复选框的值,如果不选中,值将赋值为0,如果选中复选框,则将值赋值为1

$("form").submit(function () {

    var this_master = $(this);

    this_master.find('input[type="checkbox"]').each( function () {
        var checkbox_this = $(this);


        if( checkbox_this.is(":checked") == true ) {
            checkbox_this.attr('value','1');
        } else {
            checkbox_this.prop('checked',true);
            //DONT' ITS JUST CHECK THE CHECKBOX TO SUBMIT FORM DATA    
            checkbox_this.attr('value','0');
        }
    })
})

您可以在提交表单之前添加隐藏元素。

$('form').submit(function() {
  $(this).find('input[type=checkbox]').each(function (i, el) {
    if(!el.checked) {
      var hidden_el = $(el).clone();
      hidden_el[0].checked = true;
      hidden_el[0].value = '0';
      hidden_el[0].type = 'hidden'
      hidden_el.insertAfter($(el));
    }
  })
});
function SubmitCheckBox(obj) {
     obj.value   = obj.checked ? "on" : "off";
     obj.checked = true;
     return obj.form.submit();
}

<input type=checkbox name="foo" onChange="return SubmitCheckBox(this);">