asp.net程序中实现checkbox全选代码

程序开发中经常会要用到checkbox的全选,通常情况下是在一些数据绑定控件中如gridview 等 。下面以repeater 为例,在repeater的header 和item中放入checkbox控件 

<asp:Repeater ID="rptGroup" runat="server"> 
            <HeaderTemplate> 
                <table width="100%" cellspacing="1" class="tab"> 
                    <tr> 
                        <td width="3%" align="center" class="td-01"><input type="checkbox" id="chkAll" name="chkAll" value="checkbox" οnclick="checkAll(’chkAll’,this);" />        </td> 
                    </tr> 
            </HeaderTemplate> 
            <ItemTemplate> 
                <tr> 
                <td align="center" ><input type="checkbox" name="chkSelect" value=’<%# Eval("ID") %>’  οnclick="checkAll(’chkAll’,this);"/></td> 
                </tr> 
            </ItemTemplate> 
            <FooterTemplate> 
                </table> 
            </FooterTemplate> 
        </asp:Repeater> 


下面就是js脚本了
checkAll方法是实现checkbox的全选和取消全选的 

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; 
    } 
}


checkSelectNo 函数是用来获取 所有checkbox 选中的个数 这个在用来判断 是否有勾选时非常有用。

function checkSelectNo(chkAllID) 

    var chks = document.getElementsByTagName("input"); 
    var selectNo =0; 
    for(var i =0; i < chks.length; i++) 
    { 
       if(chks[i].type == "checkbox") 
       { 
            if(chks[i].id != chkAllID && chks[i].checked) 
            { 
                selectNo++; 
            } 
       } 
    }   
    return selectNo; 
}
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值