2011-10-04 168 views
0

的两个不同的列我有一个选择的复选框的两列所有复选框在每一列的底部。我希望首先选中所有复选框来检查一列中的所有内容,然后再选中所有复选框以在第二列中打勾。创建两个选择所有复选框复选框

请看下面的例子 - http://www.dtrmedical.com/test-site/index.php?id=3&productid=118

第一选择所有复选框工作正常(它蜱报价柱内的一切)。我无法让第二个人与它一起工作。它应该在样本列中勾选/取消全部。

任何人都可以帮忙吗?

这是产品复选框:

<td valign="middle" align="center" style="background-color:#C3DCCD;"><input style="margin-top:5px;" type="checkbox" name="products-quote" value="echo $product_option['product_code']; ?>" /></td> 
<td valign="middle" align="center" style="background-color:#D3C4DF;"><input style="margin-top:5px;" type="checkbox" name="products-sample" value="echo $product_option['product_code']; ?>" /></td> 

这是JavaScript做的第一选择所有:

<script language="JavaScript"> 
function toggle(source) { 
    checkboxes = document.getElementsByName('products-quote'); 
    for(var i in checkboxes) 
    checkboxes[i].checked = source.checked; 
} 
</script> 

而这些选择所有的复选框:

<td valign="middle" align="center" style="background-color:#efefef;"><input style="margin-top:5px;" type="checkbox" onClick="toggle(this)" name="products-quote" value="echo $product_option['product_code']; ?>" /></td> 
<td valign="middle" align="center" style="background-color:#efefef;"><input style="margin-top:5px;" type="checkbox" name="products-sample" value="echo $product_option['product_code']; ?>" /></td> 
+0

您是否已经检查过代码中有关'value'的缺陷,正如我在下面的回答中所述? –

回答

1

好吧,看起来你的每个“全选”复选框与复选框的其余部分具有相同的名称属性ñ其列,所以相当小的变化得到它的工作就是用你已经有一个小的改动使用功能:

非但没有复选框用硬编码的名称获得的那些与与点击元素名称相同。然后你的“全选”复选框可以说onClick="toggle(this)"来调用相同的功能。

+0

谢谢,这很好。 (我会尽快接受!) – Rob

0

我会推荐给所有要检查同一类,然后只需使用jQuery的复选框(我看见它已经经过了示例页面上使用),检查/取消选中你需要的一切。

//on check all checkbox 
if(this.checked){ 
    $(".myCheckboxes").attr("checked", true); 
}else{ 
    $(".myCheckboxes").attr("checked", false); 
}