实现checkboxlist的全选

来源:互联网 发布:acl 软件许可费 编辑:程序博客网 时间:2024/04/29 19:29

第一种:利用客户端控件实现
JS:

<script type="text/javascript">
function checkAll()
{
var checklist=document.getElementsByTagName("input");
for(var i=0;i<checklist.length;i++)
{
if(checklist[i].type=="checkbox")
{
checklist[i].checked=document.form1.ck.checked;
}
}
}
</script>

GridView控件:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" >
<Columns>
<asp:BoundField DataField="ProductID" HeaderText="产品编号" />
<asp:TemplateField>
<HeaderTemplate>
<input id="ck" type="checkbox" onclick="checkAll();" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="checkbox1" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>

第二种:利用服务器端控件实现
复制代码 代码如下:
protected void 全选_CheckedChanged(object sender, EventArgs e)
{
if (全选.Checked == true)
{
for (int i = 0; i < GridView1.Rows.Count; i++)
{
CheckBox ck = (CheckBox)GridView1.Rows[i].Cells[0].FindControl("checkbox1") as CheckBox;
if (ck!=null)
{
ck.Checked = true;
}
}
}
else
{
for (int i = 0; i < GridView1.Rows.Count; i++)
{
CheckBox ck = (CheckBox)GridView1.Rows[i].Cells[0].FindControl("checkbox1") as CheckBox;
if (ck != null)
{
ck.Checked = false;
}
}
}
}

或者,你可以像这样来做:

<html><head><title></title></head><body><input type="checkbox" id="chkAll" name="chkAll" value="checkbox" onclick="checkAll('chkAll',this);" /><input type="checkbox" name="chkSelect"   onclick="checkAll('chkAll',this);" /><input type="checkbox" name="chkSelect"   onclick="checkAll('chkAll',this);" /><input type="checkbox" name="chkSelect"   onclick="checkAll('chkAll',this);" /><input type="checkbox" name="chkSelect"   onclick="checkAll('chkAll',this);" /><input type="checkbox" name="chkSelect"   onclick="checkAll('chkAll',this);" /><script type="text/javascript">function checkAll(chkAllID,thisObj){    var chkAll = document.getElementById(chkAllID);    var chks = document.getElementsByTagName("input");    var chkNo = 0;    var selectNo = 0;    for(var i =0; i < chks.length; i++)    {       if(chks[i].type == "checkbox")       {          //全选触发事件            if(chkAll == thisObj)          {             chks[i].checked = thisObj.checked;                       }                    //非全选触发          else          {            if(chks[i].checked && chks[i].id != chkAllID)             selectNo++;          }          if(chks[i].id != chkAllID)          {            chkNo++;          }       }    }     if(chkAll != thisObj)    {        chkAll.checked = chkNo==selectNo;    }}</script></body></html>