我有一堆默认选中的复选框。我的用户可能会取消选中一些复选框(如果有的话),并选中其余的复选框。
是否有任何方法使表单POST未选中的复选框,而不是选中的复选框?
我有一堆默认选中的复选框。我的用户可能会取消选中一些复选框(如果有的话),并选中其余的复选框。
是否有任何方法使表单POST未选中的复选框,而不是选中的复选框?
当前回答
这个解决方案的灵感来自@desw的一个。
如果您的输入名称是“表单样式”的,那么只要选中一个复选框,您就会失去与复选框值的数组索引关联,每次选中一个复选框,这种“分离”就增加一个单元。这可能是用于插入由某些字段组成的雇员的表单的情况,例如:
<input type="text" name="employee[]" />
<input type="hidden" name="isSingle[] value="no" />
<input type="checkbox" name="isSingle[] value="yes" />
如果您一次插入三个员工,并且第一个和第二个员工是单个的,那么您最终将得到一个5元素的isSingle数组,因此您将不能一次遍历三个数组,例如,为了在数据库中插入员工。
你可以用一些简单的数组后处理来克服这个问题。我在服务器端使用PHP,我这样做:
$j = 0;
$areSingles = $_POST['isSingle'];
foreach($areSingles as $isSingle){
if($isSingle=='yes'){
unset($areSingles[$j-1]);
}
$j++;
}
$areSingles = array_values($areSingles);
其他回答
我也喜欢这个解决方案,你只是发布一个额外的输入字段,使用JavaScript似乎有点hack对我来说。
取决于你使用什么你的后端将取决于哪个输入先去。
对于使用第一次出现的服务器后端(JSP),您应该执行以下操作。
<input type="checkbox" value="1" name="checkbox_1"/>
<input type="hidden" value="0" name="checkbox_1"/>
对于使用最后一次出现的服务器后端(PHP、Rails),您应该执行以下操作。
<input type="hidden" value="0" name="checkbox_1"/>
<input type="checkbox" value="1" name="checkbox_1"/>
对于服务器后端,其中所有事件都存储在列表数据类型([],数组)中。(Python / Zope)
你可以按照你喜欢的任何顺序发布,你只需要尝试从输入中获得带有复选框类型属性的值。如果复选框在隐藏元素之前,列表的第一个索引如果复选框在隐藏元素之后,列表的最后一个索引。
对于一个服务器后端,所有发生的事件都用逗号连接(ASP。Net / iis) 您需要使用逗号作为分隔符来(拆分/分解)字符串,以创建列表数据类型。([])
现在,如果复选框在隐藏元素之前,您可以尝试获取列表的第一个索引,如果复选框在隐藏元素之后,则可以尝试获取列表的最后一个索引。
图片来源
一种常见的方法是在每个复选框中附带一个隐藏变量。
<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
上面并没有完全回答这个问题,但是提供了一种实现类似功能的替代方法。
对于复选框,一个不使用隐藏类型值的简单方法是:
< >形式 <input type='checkbox' name='self - destruct' value='1'> > < /形式
在PHP中,对于表单数据的发布:
// Sanitize form POST data
$post = filter_var_array($_POST, FILTER_SANITIZE_STRING);
// set the default checkbox value
$selfDestruct = '0';
if(isset($post["selfdestruct"]))
$selfDestruct = $post["selfdestruct"];
您可以在提交表单之前添加隐藏元素。
$('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));
}
})
});
我使用这个jQuery块,它将在提交时为每个未选中的复选框添加一个隐藏输入。它将保证您每次都为每个复选框提交一个值,而不会弄乱您的标记,并冒着忘记在稍后添加的复选框上执行此操作的风险。它也与您正在使用的任何后端堆栈(PHP、Ruby等)无关。
// Add an event listener on #form's submit action...
$("#form").submit(
function() {
// For each unchecked checkbox on the form...
$(this).find($("input:checkbox:not(:checked)")).each(
// Create a hidden field with the same name as the checkbox and a value of 0
// You could just as easily use "off", "false", or whatever you want to get
// when the checkbox is empty.
function(index) {
var input = $('<input />');
input.attr('type', 'hidden');
input.attr('name', $(this).attr("name")); // Same name as the checkbox
input.attr('value', "0"); // or 'off', 'false', 'no', whatever
// append it to the form the checkbox is in just as it's being submitted
var form = $(this)[0].form;
$(form).append(input);
} // end function inside each()
); // end each() argument list
return true; // Don't abort the form submit
} // end function inside submit()
); // end submit() argument list