Javascript实现在DataGrid上的CheckBox全选和取消

来源:互联网 发布:阿里云 可用区 编辑:程序博客网 时间:2024/04/28 07:28

(本文适用与.Net 1.1)

1.   
      用C#等写的CheckBox需要回发到服务端执行,  
而用JavaScript可以在直接客户端实现,效率高些 

2.  DataGrid中的代码主要片段: 
 
               <Columns> 
 
                       <HeaderTemplate>              //头模板代码 
                                     <asp:CheckBox  id="chkHeader"  runat="server"  AutoPostBack="False"      //AutoPostBack设为假,不需要回发 
 
                                                       onclick="javascript:SelectAll(this,'myDataGrid');"></asp:CheckBox>  //myDataGrid即为我的DataGrid的名称,使用时自行更换。
                       </HeaderTemplate> 
 
                     <ItemTemplate>                        //项模板代码 
                                     <asp:CheckBox  id="chkItem"  runat="server"></asp:CheckBox> 
                     </ItemTemplate> 
 
               </Columns>

3.在当页加入脚本: 
 
   <script language="javascript" type="text/javascript"> 
             function SelectAll(tempControl,tempSpan) 
             {
     //将除头模板中的其它所有的CheckBox取反
     var theBox=tempControl;
     var xState=theBox.checked;
     var strTemp=tempSpan;

     elem=theBox.form.elements; 
     for(i=0;i<elem.length;i++)
     {
      if(elem[i].type=="checkbox" && elem[i].id!=theBox.id && elem[i].name.substr(0,elem[i].name.indexOf(':'))==strTemp)
       {
        if(elem[i].checked!=xState)
        {
         elem[i].click();
        }
       }
     }
   }
  </script>

4.当使用者选择好后台代码取得某列CheckBox的值: 
for  (int  i  =  0;i  <this.DataGrid.Items.Count;i++) 

               bool  blnIfSelect  =  ((CheckBox)this.DataGrid.Items[i].FindControl("chkItem")).Checked; 
               ....;      //这是可以根据blnIfSelect进行各种操作了                   
}

原创粉丝点击