仰天一笑

昨日不悔,今日勿失,明日莫忧! —徐羽

  博客园 :: 首页 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::
  230 随笔 :: 27 文章 :: 791 评论 :: 39 Trackbacks

最简格式:这是一个偷巧的方法,但不通用。前提是这个页面只有一个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}

posted on 2006-12-18 19:51 仰天一笑 阅读(4664) 评论(18)  编辑 收藏 所属分类: 原创天地ASP.Net-C#Javascript/Ajax/XML

评论

#1楼  2006-12-18 20:15 WideWeide      
呵呵,没看这几天的JQuery系列,可以更简单
  回复  引用  查看    

#2楼  2006-12-18 20:16 WideWeide      
http://www.cnblogs.com/young18/category/79064.html
  回复  引用  查看    

#3楼  2006-12-19 10:44 涟漪勇      
这个方法好像简便些,没有反选功能



http://www.cnblogs.com/rippleyong/articles/596537.html


//使用MasterPage
function checkAll(flag, prefix) {
var form = document.forms['aspnetForm'];


for (var i = 0; i < form.elements.length; i++) {
if (form.elements[i].type == "checkbox" && (form.elements[i].name.search(prefix) > 0) && !form.elements[i].disabled)
form.elements[i].checked = flag;
}
}
//没有使用MasterPage
function checkAll_NoMasterPage(flag, form, prefix) {
if (!form)
return;

if (prefix)
var reg = new RegExp("^"+prefix, "");
for (var i = 0; i < form.elements.length; i++) {
if (form.elements[i].type == "checkbox" && (!prefix || form.elements[i].name.search(reg) == 0) && !form.elements[i].disabled)
form.elements[i].checked = flag;
}
}
//删除前的确定
function toDel(prefix){
var checkvalue;
var form = document.forms['aspnetForm'];
checkvalue=false;

for (var i = 0; i < form.elements.length; i++) {
if (form.elements[i].type == "checkbox" && (form.elements[i].name.search(prefix) > 0) && !form.elements[i].disabled && form.elements[i].checked)
checkvalue=true;
}

if (checkvalue!=false){
return confirm('你确认要删除选定的记录?');

}
else{
 alert(" 请在列表中选择要删除的记录!");
  return false;
}
}
  回复  引用  查看    

#4楼  2006-12-19 13:25 缘易姿姿[匿名]      
这没什么!
要是RadioButton的多组单选问题还值得研究!
  回复  引用  查看    

最近的项目正好有一块这样的功能,你这个感觉还是有些复杂,看看这样改是否合适?
  回复  引用    

#6楼  2006-12-20 10:15 Lion      
1.使用getElementsByTagName("Input")获取datagrid呈现到页面以后表格中的所有input元素数组(arr1)
2.遍历input元素数组(arr1),取出type='checkbox'的一类放到一个全局的新数组里(arr2)
3.当全选时只需要遍历arr2,设置checked=true,反之则设置checked=false
  回复  引用  查看    

#7楼 [楼主] 2006-12-20 15:48 仰天一笑      
@Lion
谢谢提供设计思路,哈哈

  回复  引用  查看    

#8楼  2006-12-27 09:30 DreamCat [未注册用户]
checkbox 不是有 click() 方法么?反选只不过是重新 click() 一次,你们可真笨,非得用 checked 属性。
  回复  引用    

#9楼 [楼主] 2006-12-27 15:11 仰天一笑