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

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


当前回答

一种常见的方法是在每个复选框中附带一个隐藏变量。

<input type="checkbox" name="mycheckbox" />
<input type="hidden" name="mycheckbox.hidden"/>

在服务器端,我们首先检测隐藏变量列表,对于每个隐藏变量,我们尝试查看相应的复选框条目是否提交到表单数据中。

服务器端算法可能是这样的:

for input in form data such that input.name endswith .hidden
  checkboxName = input.name.rstrip('.hidden')
  if chceckbName is not in form, user has unchecked this checkbox

上面并没有完全回答这个问题,但是提供了一种实现类似功能的替代方法。

其他回答

有一个更好的解决办法。 首先,只向选中的复选框提供name属性。 然后点击提交,通过JavaScript函数检查所有未选中的框。 当你提交时,只有那些会在表单集合中检索到那些有name属性的。

  //removing name attribute from all checked checkboxes
                  var a = $('input:checkbox:checked');
                   $(a).each(function () {
                       $(this).removeAttr("name");        
                   });

   // checking all unchecked checkboxes
                   var b = $("input:checkbox:not(:checked)");
                   $(b).each(function () {
                       $(this).attr("checked", true);
                   });

优势: 不需要创建额外的隐藏框,并操作它们。

简单的答案。如果你的代码中有checked="checked"将其改为unchecked="unchecked"

所以你的文本应该是这样的:

输入类型=“复选框” 名称=“您选择的名称” 未选中=“未选中”

如果它不包含这个,你总是可以添加它

这是对之前答案的一种尝试,以自动保留具有特定值(在本例中为0)的未选中复选框,而不会在提交时选中所有复选框。

$("form").submit(function () {
    let this_master = $(this);

    // Remove any of the hidden values that may already be there (if the user previously canceled the submit)
    this_master.find("*[id^='hiddenchkinput_']").remove();

    // Get all unchecked checkboxes
    this_master.find('input:checkbox:not(:checked)').each(function () {
      let thisChk = $(this);

      // Create a hidden input with the same name as the checkbox
      let newInput = document.createElement('input');
      $(newInput).attr('name', thisChk.attr('id'))
        .attr('id', 'hiddenchkinput_' + thisChk.attr('id'))
        .attr('type', 'hidden')
        .val('0');
      // Append the new input to the end of the form
      this_master.append(newInput);
    });
})

所有答案都很好,但如果您在一个表单中有多个具有相同名称的复选框,并且您希望发布每个复选框的状态。然后我已经解决了这个问题,通过放置一个隐藏字段的复选框(名称相关的我想要的)。

<input type="hidden" class="checkbox_handler" name="is_admin[]" value="0" />
<input type="checkbox" name="is_admin_ck[]" value="1" />

然后用jquery代码控制复选框的变化状态:

$(documen).on("change", "input[type='checkbox']", function() {
    var checkbox_val = ( this.checked ) ? 1 : 0;
    $(this).siblings('input.checkbox_handler').val(checkbox_val);
});

现在改变任何复选框,它将改变相关隐藏字段的值。在服务器上,你只能看到隐藏字段,而不是复选框。

希望这能帮助到有这种问题的人。快乐:)

您不需要为所有复选框创建一个隐藏字段,只需复制我的代码。 它会改变复选框的值,如果不选中,值将赋值为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');
        }
    })
})