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

最简格式:这是一个偷巧的方法,但不通用。前提是这个页面只有一个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
/* 分页
  2InBlock.gif    参数说明:
  3InBlock.gif    prefix:前缀;chkAll:全选框;chkSingle:单选框ID
  4InBlock.gif    
  5InBlock.gif    使用方法:
  6InBlock.gif    if(e.Item.ItemType == ListItemType.Header)
  7InBlock.gif    {
  8InBlock.gif        ((CheckBox)e.Item.Cells[1].FindControl("chkAll")).Attributes.Add("onclick","CheckAll('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
  9InBlock.gif    }
 10ExpandedBlockEnd.gif*/

 11None.giffunction CheckAll(prefix,chkAll,chkSingle)
 12ExpandedBlockStart.gifContractedBlock.gifdot.gif{
 13InBlock.gif    var indexChkAll;
 14InBlock.gif    if(prefix.length != 0)
 15ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
 16InBlock.gif        indexChkAll        = prefix + "__ctl2_" + chkAll;
 17ExpandedSubBlockEnd.gif    }

 18InBlock.gif    else
 19ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
 20InBlock.gif        indexChkAll        = chkAll;
 21ExpandedSubBlockEnd.gif    }

 22InBlock.gif    var objChkAll = document.getElementById(indexChkAll);
 23InBlock.gif    var tempObj;
 24InBlock.gif    for(var i=0;i<document.forms[0].elements.length;i++)
 25ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{    
 26InBlock.gif        tempObj = document.forms[0].elements[i];
 27InBlock.gif        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
 28ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
 29InBlock.gif            tempObj.checked = objChkAll.checked;
 30ExpandedSubBlockEnd.gif        }

 31ExpandedSubBlockEnd.gif    }

 32ExpandedBlockEnd.gif}

 33ExpandedBlockStart.gifContractedBlock.gif/**//* 分页
 34InBlock.gif    参数说明:
 35InBlock.gif    prefix:前缀;chkAll:全选框;chkSingle:单选框ID
 36InBlock.gif    
 37InBlock.gif    使用方法:
 38InBlock.gif    if(e.Item.ItemType == ListItemType.AlternatingItem || e.Item.ItemType == ListItemType.Item)
 39InBlock.gif    {
 40InBlock.gif        ((CheckBox)e.Item.Cells[1].FindControl("chkSingle")).Attributes.Add("onclick","CheckSingle('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
 41InBlock.gif    }
 42ExpandedBlockEnd.gif*/

 43None.giffunction CheckSingle(prefix,chkAll,chkSingle)
 44ExpandedBlockStart.gifContractedBlock.gifdot.gif{
 45InBlock.gif    var indexChkAll;
 46InBlock.gif    if(prefix.length != 0)
 47ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
 48InBlock.gif        indexChkAll        = prefix + "__ctl2_" + chkAll;
 49ExpandedSubBlockEnd.gif    }

 50InBlock.gif    else
 51ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
 52InBlock.gif        indexChkAll        = chkAll;
 53ExpandedSubBlockEnd.gif    }

 54InBlock.gif    var objChkAll = document.getElementById(indexChkAll);
 55InBlock.gif    var tempObj;
 56InBlock.gif    var allCount    = 0;
 57InBlock.gif    var checkCount    = 0;
 58InBlock.gif    for(var i=0;i<document.forms[0].elements.length;i++)
 59ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{    
 60InBlock.gif        tempObj = document.forms[0].elements[i];
 61InBlock.gif        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
 62ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
 63InBlock.gif            if(tempObj.checked)
 64ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
 65InBlock.gif                checkCount++;
 66ExpandedSubBlockEnd.gif            }

 67InBlock.gif            else
 68ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
 69InBlock.gif                objChkAll.checked = false;
 70InBlock.gif                //break;
 71ExpandedSubBlockEnd.gif            }

 72InBlock.gif            allCount++;
 73ExpandedSubBlockEnd.gif        }

 74ExpandedSubBlockEnd.gif    }

 75InBlock.gif    if(checkCount != allCount)
 76ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
 77InBlock.gif        objChkAll.checked = false;
 78ExpandedSubBlockEnd.gif    }

 79InBlock.gif    else
 80ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
 81InBlock.gif        if(allCount != 0)
 82ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
 83InBlock.gif            objChkAll.checked = true;
 84ExpandedSubBlockEnd.gif        }

 85ExpandedSubBlockEnd.gif    }

 86ExpandedBlockEnd.gif}

 87ExpandedBlockStart.gifContractedBlock.gif/**//*
 88InBlock.gif    参数说明:
 89InBlock.gif    prefix:前缀;chkAll:全选框;chkSingle:单选框ID
 90InBlock.gif    type:1【全选】,2【反选】,3【取消】
 91InBlock.gif    
 92InBlock.gif    使用方法:
 93InBlock.gif    this.btnSelectAll.Attributes.Add("onClick","CheckType('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle',1);");
 94InBlock.gif    this.btnUnSelectAll.Attributes.Add("onClick","CheckType('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle',2);");
 95InBlock.gif    this.btnCancelSelect.Attributes.Add("onClick","CheckType('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle',3);");
 96ExpandedBlockEnd.gif*/

 97None.giffunction CheckType(prefix,chkAll,chkSingle,type)
 98ExpandedBlockStart.gifContractedBlock.gifdot.gif{
 99InBlock.gif    var indexChkAll;
100InBlock.gif    if(prefix.length != 0)
101ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
102InBlock.gif        indexChkAll        = prefix + "__ctl2_" + chkAll;
103ExpandedSubBlockEnd.gif    }

104InBlock.gif    else
105ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
106InBlock.gif        indexChkAll        = chkAll;
107ExpandedSubBlockEnd.gif    }

108InBlock.gif    var objChkAll = document.getElementById(indexChkAll);
109InBlock.gif    var tempObj;
110InBlock.gif    var allCount    = 0;
111InBlock.gif    var checkCount    = 0;
112InBlock.gif    for(var i=0;i<document.forms[0].elements.length;i++)
113ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{    
114InBlock.gif        tempObj = document.forms[0].elements[i];
115InBlock.gif        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
116ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
117InBlock.gif            switch(type)
118ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
119InBlock.gif                case 1:
120InBlock.gif                    tempObj.checked = true;
121InBlock.gif                    break;
122InBlock.gif                case 2:
123InBlock.gif                    tempObj.checked = !tempObj.checked;
124InBlock.gif                    break;
125InBlock.gif                case 3:
126InBlock.gif                    tempObj.checked = false;
127InBlock.gif                    break;
128ExpandedSubBlockEnd.gif            }

129InBlock.gif            if(tempObj.checked)
130ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
131InBlock.gif                checkCount++;
132ExpandedSubBlockEnd.gif            }

133InBlock.gif            allCount++;
134ExpandedSubBlockEnd.gif        }

135ExpandedSubBlockEnd.gif    }

136InBlock.gif    if(checkCount != allCount)
137ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
138InBlock.gif        objChkAll.checked = false;
139ExpandedSubBlockEnd.gif    }

140InBlock.gif    else
141ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
142InBlock.gif        if(allCount != 0)
143ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
144InBlock.gif            objChkAll.checked = true;
145ExpandedSubBlockEnd.gif        }

146ExpandedSubBlockEnd.gif    }

147InBlock.gif    window.event.returnValue = false;
148InBlock.gif    return false;
149ExpandedBlockEnd.gif}

150None.gif
151ExpandedBlockStart.gifContractedBlock.gif/**//*
152InBlock.gif    参数说明:
153InBlock.gif    prefix:前缀;chkAll:全选框;chkSingle:单选框ID
154InBlock.gif
155InBlock.gif    使用方法:
156InBlock.gif    this.btnDelete.Attributes.Add("onClick","SubmitCheckBox('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
157ExpandedBlockEnd.gif*/

158None.giffunction SubmitCheckBox(prefix,chkAll,chkSingle,msg)
159ExpandedBlockStart.gifContractedBlock.gifdot.gif{
160InBlock.gif    var indexChkAll;
161InBlock.gif    if(prefix.length != 0)
162ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
163InBlock.gif        indexChkAll        = prefix + "__ctl2_" + chkAll;
164ExpandedSubBlockEnd.gif    }

165InBlock.gif    else
166ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
167InBlock.gif        indexChkAll        = chkAll;
168ExpandedSubBlockEnd.gif    }

169InBlock.gif    var objChkAll = document.getElementById(indexChkAll);
170InBlock.gif    
171InBlock.gif    var tempObj;
172InBlock.gif    var allCount    = 0;
173InBlock.gif    var checkCount    = 0;
174InBlock.gif    for(var i=0;i<document.forms[0].elements.length;i++)
175ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{    
176InBlock.gif        tempObj = document.forms[0].elements[i];
177InBlock.gif        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
178ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
179InBlock.gif            if(tempObj.checked)
180ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
181InBlock.gif                checkCount++;
182ExpandedSubBlockEnd.gif            }

183InBlock.gif            allCount++;
184ExpandedSubBlockEnd.gif        }

185ExpandedSubBlockEnd.gif    }

186InBlock.gif    if(allCount == 0//没有数据
187ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
188InBlock.gif        window.alert("当前没有" + msg + "可供删除dot.gif");
189InBlock.gif        window.event.returnValue = false;
190InBlock.gif        return false;
191ExpandedSubBlockEnd.gif    }

192InBlock.gif    else
193ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
194InBlock.gif        if(checkCount == 0)
195ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
196InBlock.gif            window.alert("没有选中要删除的" + msg + "dot.gif");
197InBlock.gif            window.event.returnValue = false;
198InBlock.gif            return false;
199ExpandedSubBlockEnd.gif        }

200InBlock.gif        else
201ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
202InBlock.gif            //if(window.confirm("确定要删除当前选中的【" + checkCount.toString() + "】项吗?") == false)
203InBlock.gif            if(window.confirm("确定要删除当前选中的" + msg + "吗?"== false)
204ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
205InBlock.gif                window.event.returnValue = false;
206InBlock.gif                return false;
207ExpandedSubBlockEnd.gif            }

208ExpandedSubBlockEnd.gif        }

209ExpandedSubBlockEnd.gif    }

210ExpandedBlockEnd.gif}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值