全選及取消全選

頁面代碼:

<asp:GridView ID="GridView1" runat="server" Width="100%" CellPadding="4" ForeColor="#333333"
                            AutoGenerateColumns="False" AllowPaging="True" PageSize="20" BorderColor="Silver"
                            BorderStyle="Solid" BorderWidth="1px" OnRowDataBound="GridView1_RowDataBound"
                            EmptyDataText="沒有數據記錄">
                            <Columns>
                                <asp:TemplateField>
                                    <HeaderTemplate>
                                        <asp:CheckBox ID="cbSelectAll" runat="server" AutoPostBack="false" onClick="javascript:SelectAll(this)" />
                                        <asp:Label ID="lblSelectText" runat="server" Text="全選" ></asp:Label>
                                    </HeaderTemplate>
                                    <ItemTemplate>
                                        &nbsp;<asp:CheckBox ID="cbSelect" runat="server" AutoPostBack="false" onClick="changechecked(this)"/>
                                    </ItemTemplate>
                                </asp:TemplateField>

 </asp:GridView>

 

JavaScript代碼:

//全選及取消全選
function SelectAll(tempControl) {
    //將除頭模板中的其他所有的CheckBox取反
    var theBox = tempControl;
    var lblShow = document.getElementById("GridView1_ctl01_" + "lblSelectText");
    xState = theBox.checked;
    elem = theBox.form.elements;
    for (i = 0; i < elem.length; i++) {
        if (elem[i].type == "checkbox" && elem[i].id != theBox.id) {
            if (lblShow.innerHTML == "全選")
                elem[i].checked = true;
            else
                elem[i].checked = false;
        }
    }
    if (lblShow.innerHTML == "全選")
        lblShow.innerHTML = "取消全選";
    else
        lblShow.innerHTML = "全選";
    theBox.checked = false;

}

//GridView中每行前的checkBox選中的函數
function changechecked(checkbut){  
 var v =checkbut.checked;  
 var lblShow = document.getElementById("GridView1_ctl01_lblSelectText");  //GridView1_ctl01_lblSelectText是頁面運行後源代碼裏的Label控件的ID
 if (v) {  
     if (isallselected())
         lblShow.innerHTML = "取消全選";
} else {    
     if(isallcancel()) 
        lblShow .innerHTML="全選";
    }  
}
 //判斷是否全不選中
 function isallcancel(){
    var f = document .form1;
    for(i=0;i<f.elements.length;i++){
        if(f.elements[i].type =="checkbox" && f.elements[i].id !="GidView1_ctl01_cbSelectAll")//GidView1_ctl01_cbSelectAll是頁面運行後源代碼的CheckBox的ID
            if(f.elements[i].checked)
                 return false ;
    }
    return true ;
}
 
 //判斷是否全部選中
function isallselected(){  
 var f=document.form1;  
for(i=0;i<f.elements.length;i++){
    if (f.elements[i].type == "checkbox" && f.elements[i].id != "GridView1_ctl01_cbSelectAll")
        if (f.elements[i].checked != true) {
        return false;
    }  
 }  
  return true;  
}