电脑技术学习

javascript实现datagrid客户端checkbox列的全选,反选

dn001

最简格式：这是一个偷巧的方法，但不通用。前提是这个页面只有一个datagrid，且只有datagrid中有checkbox；这个就比较方便。主要思路就是搜索出整个页面的checkbox，将它们全部选中或反选。
// 全选
function allCheck()
{
for (var i=0;i<Form1.elements.length;i++)
{
var e=Form1.elements[i];
if (e.type=='checkbox')
e.checked=true;
}

}
//反选
function revCheck()
{
for (var i=0;i<Form1.elements.length;i++)
{
var e=Form1.elements[i];
if (e.type=='checkbox')
e.checked=!e.checked;
}
}


通用简单格式
因为asp.net页面中生成datagrid中的checkbox，他的ID是要改变的，所以我们寻找它们的规律，就可以准确的找到这个控件，从而进行全选和反选及选中的操作，
参数说明：
prefix：前缀；s：选择框ID；chk：选择框的ID；


function getObj( objID )
{
return document.getElementById( objID );
}

// 全选
function _SelectAll( prefix,s,chk )
{
var oArr = _GetColl( prefix,s,chk );
for( var o in oArr )
{
oArr[o].checked = true;
}
}
// 反选
function _RevSelect( prefix,s,chk )
{
var oArr = _GetColl( prefix,s,chk );
for( var o in oArr )
{
oArr[o].checked = !oArr[o].checked;
}
}

// 获值
function _GetColl( prefix,s,chk )
{
var i = s;
var oArr = new Array();
while( true)
{
var o = getObj( prefix + '__ctl' + i + '_' + chk);
if( o != null )
{
oArr.push( o );
}
else
{
break;
}
i++;
}

return oArr;
}
// 检查是否选中
function _CheckSelect( prefix,s,chk )
{
var oArr = _GetColl( prefix,s,chk );
for( var o in oArr )
{
if( oArr[o].checked)
{
return true;
}
}
return false;

}

推荐通用详细格式：http://www.cnblogs.com/ghd258/archive/2005/11/07/270449.html#Post
/* 分页
2;参数说明：
3;prefix：前缀；chkAll：全选框；chkSingle：单选框ID
4;
5;使用方法：
6;if(e.Item.ItemType == ListItemType.Header)
7;{
8;;;;;((CheckBox)e.Item.Cells[1].FindControl("chkAll")).Attributes.Add("onclick","CheckAll('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
9;}
10*/
11function CheckAll(prefix,chkAll,chkSingle)
12{
13;var indexChkAll;
14;if(prefix.length != 0)
15;{
16;;;;;indexChkAll;;;;;= prefix + "__ctl2_" + chkAll;
17;}
18;else
19;{
20;;;;;indexChkAll;;;;;= chkAll;
21;}
22;var objChkAll = document.getElementById(indexChkAll);
23;var tempObj;
24;for(var i=0;i<document.forms[0].elements.length;i++)
25;{;
26;;;;;tempObj = document.forms[0].elements[i];
27;;;;;if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
28;;;;;{
29;tempObj.checked = objChkAll.checked;
30;;;;;}
31;}
32}
33/**//* 分页
34;参数说明：
35;prefix：前缀；chkAll：全选框；chkSingle：单选框ID
36;
37;使用方法：
38;if(e.Item.ItemType == ListItemType.AlternatingItem || e.Item.ItemType == ListItemType.Item)
39;{
40;;;;;((CheckBox)e.Item.Cells[1].FindControl("chkSingle")).Attributes.Add("onclick","CheckSingle('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
41;}
42*/
43function CheckSingle(prefix,chkAll,chkSingle)
44{
45;var indexChkAll;
46;if(prefix.length != 0)
47;{
48;;;;;indexChkAll;;;;;= prefix + "__ctl2_" + chkAll;
49;}
50;else
51;{
52;;;;;indexChkAll;;;;;= chkAll;
53;}
54;var objChkAll = document.getElementById(indexChkAll);
55;var tempObj;
56;var allCount;= 0;
57;var checkCount;= 0;
58;for(var i=0;i<document.forms[0].elements.length;i++)
59;{;
60;;;;;tempObj = document.forms[0].elements[i];
61;;;;;if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
62;;;;;{
63;if(tempObj.checked)
64;{
65;;;;;checkCount++;
66;}
67;else
68;{
69;;;;;objChkAll.checked = false;
70;;;;;//break;
71;}
72;allCount++;
73;;;;;}
74;}
75;if(checkCount != allCount)
76;{
77;;;;;objChkAll.checked = false;
78;}
79;else
80;{
81;;;;;if(allCount != 0)
82;;;;;{
83;objChkAll.checked = true;
84;;;;;}
85;}
86}
87/**//*
88;参数说明：
89;prefix：前缀；chkAll：全选框；chkSingle：单选框ID
90;type：1【全选】，2【反选】，3【取消】
91;
92;使用方法：
93;this.btnSelectAll.Attributes.Add("onClick","CheckType('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle',1);");
94;this.btnUnSelectAll.Attributes.Add("onClick","CheckType('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle',2);");
95;this.btnCancelSelect.Attributes.Add("onClick","CheckType('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle',3);");
96*/
97function CheckType(prefix,chkAll,chkSingle,type)
98{
99;var indexChkAll;
100;if(prefix.length != 0)
101;{
102;;;;;indexChkAll;;;;;= prefix + "__ctl2_" + chkAll;
103;}
104;else
105;{
106;;;;;indexChkAll;;;;;= chkAll;
107;}
108;var objChkAll = document.getElementById(indexChkAll);
109;var tempObj;
110;var allCount;= 0;
111;var checkCount;= 0;
112;for(var i=0;i<document.forms[0].elements.length;i++)
113;{;
114;;;;;tempObj = document.forms[0].elements[i];
115;;;;;if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
116;;;;;{
117;switch(type)
118;{
119;;;;;case 1:
120;tempObj.checked = true;
121;break;
122;;;;;case 2:
123;tempObj.checked = !tempObj.checked;
124;break;
125;;;;;case 3:
126;tempObj.checked = false;
127;break;
128;}
129;if(tempObj.checked)
130;{
131;;;;;checkCount++;
132;}
133;allCount++;
134;;;;;}
135;}
136;if(checkCount != allCount)
137;{
138;;;;;objChkAll.checked = false;
139;}
140;else
141;{
142;;;;;if(allCount != 0)
143;;;;;{
144;objChkAll.checked = true;
145;;;;;}
146;}
147;window.event.returnValue = false;
148;return false;
149}
150
151/**//*
152;参数说明：
153;prefix：前缀；chkAll：全选框；chkSingle：单选框ID
154
155;使用方法：
156;this.btnDelete.Attributes.Add("onClick","SubmitCheckBox('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
157*/
158function SubmitCheckBox(prefix,chkAll,chkSingle,msg)
159{
160;var indexChkAll;
161;if(prefix.length != 0)
162;{
163;;;;;indexChkAll;;;;;= prefix + "__ctl2_" + chkAll;
164;}
165;else
166;{
167;;;;;indexChkAll;;;;;= chkAll;
168;}
169;var objChkAll = document.getElementById(indexChkAll);
170;
171;var tempObj;
172;var allCount;= 0;
173;var checkCount;= 0;
174;for(var i=0;i<document.forms[0].elements.length;i++)
175;{;
176;;;;;tempObj = document.forms[0].elements[i];
177;;;;;if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
178;;;;;{
179;if(tempObj.checked)
180;{
181;;;;;checkCount++;
182;}
183;allCount++;
184;;;;;}
185;}
186;if(allCount == 0) //没有数据
187;{
188;;;;;window.alert("当前没有" + msg + "可供删除");
189;;;;;window.event.returnValue = false;
190;;;;;return false;
191;}
192;else
193;{
194;;;;;if(checkCount == 0)
195;;;;;{
196;window.alert("没有选中要删除的" + msg + "");
197;window.event.returnValue = false;
198;return false;
199;;;;;}
200;;;;;else
201;;;;;{
202;//if(window.confirm("确定要删除当前选中的【" + checkCount.toString() + "】项吗？") == false)
203;if(window.confirm("确定要删除当前选中的" + msg + "吗？") == false)
204;{
205;;;;;window.event.returnValue = false;
206;;;;;return false;
207;}
208;;;;;}
209;}
210}


http://www.cnblogs.com/skylaugh/archive/2006/12/18/596098.html

上一篇 javascript实现划词标记划词搜索功能

下一篇 用于自动添加Digg This!按钮的JavaScript

相关文章