Javascript在客户端实现遍历datagrid,DataList控件,像MSN中的全选

转载 2007年09月14日 17:19:00
今天在做项目的时候,想在 DataList实现全选
在网上查了下:
看下面的datagrid代码
<asp:TemplateColumn HeaderText="删除文章">
                                    
<HeaderTemplate>
                                        删除文章
                                        
<input type="checkbox" id="checkDel"  title="全选/全取消删除文章" onclick="CheckDelBox(this)" /><font  color=#ff0000 size=1>全选/全取消</font>
                                    
</HeaderTemplate>
                                    
<ItemTemplate>
                                        
<asp:CheckBox id="deleteCheckbox" runat="server" AutoPostBack="False"></asp:CheckBox>
                                    
</ItemTemplate>
                                
</asp:TemplateColumn>

我在选择id="checkDel" 的选择框时,要对模版中的deleteCheckbox进行全选和全取消
我调用了js

function CheckDelBox(box)    
{
        
for (var i=0;i<document.Form1.elements.length;i++)
    {
        
var e = document.Form1.elements[i];
        
if ( (e.type=='checkbox') )
        {
            
                
var o=e.name.lastIndexOf('deleteCheckbox');
                
                
if(o!=-1)
                {
                    e.checked 
= box.checked;
                }
        
        }
    }
}


注意这段代码
var o=e.name.lastIndexOf('deleteCheckbox');

在某些情况下,id在客户端的呈现不是在aspx中你指定的id了,而是控件.ClientID,比如在DataGrid中放置的一些服务器端控件,查看一下源代码可以看到id是类似DataGrid1__ctl5_Hyperlink1而不是你指定的id了

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 用一个Check或者按钮全选页面上的CheckBox </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="活靶子">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY>
<form name=frm>
<input type=checkbox value="第一个">
</br>
<input type=checkbox value="第二个">
</br>
<input type=checkbox value="第三个">
</br>
<input type=checkbox value="第四个">
</br>
<input type=checkbox value="第五个">
</br>
<input type="checkbox" name="allbox" value="Check All" onClick="CheckAll();"><font color="#6666FF">
<a href="javascript:CheckAll();" onClick="allbox.checked=!allbox.checked" style="font-size:12px">选中所有CheckBox</a>
</form>
<script language="JavaScript">
<!--
function CheckAll()
  
...{
    
for (var i=0;i<document.frm.elements.length;i++)
    
...{
      var e 
= document.frm.elements[i];
      
if (e.name != 'allbox' && e.type.toUpperCase() == "CHECKBOX")
        e.
checked = document.frm.allbox.checked;
    }

  }

//-->
</script>
</BODY>
</HTML>


WPF中DataGrid实现全选

方法一:使用模板列 前台代码如下 后台实现如下  DataGridTemplateColumn templeColum...
  • asciil
  • asciil
  • 2016年11月22日 21:18
  • 1379

easyui从datagrid中添加数据到datalist中

效果图:功能:从数据表格中添加数据到数据列表中,添加时过滤重复的,可以删除数据列表中已添加的 test ...
  • u011370903
  • u011370903
  • 2016年12月19日 17:33
  • 2745

EasyUI入门2 datagrid复选框全选效果(通过约束条件实现部分项参与的全选效果)

datagrid如果有一些项因为约束条件(比如这一项需要显示出来,但是复选框是disable的),那么在点击全选或全否复选框的时候,这些状态是disable的行是不应该被选中的...
  • xiangcns
  • xiangcns
  • 2017年06月26日 08:40
  • 1875

WPF DataGrid表头Checkbox 全选与全反选

WPF 在使用DataGrid展示数据的时候经常会使用到checkbox列,特别是id列     例如下面这种效果:          WPF 要实现DataGrid checkbox全选与全反选,方...
  • aojiancc2
  • aojiancc2
  • 2017年02月09日 16:12
  • 2649

【Asp.net之旅】--数据绑定控件之DataList

       上篇博客讨论了Repeater控件的基本用法,它是最基本的数据绑定控件,只提供了数据绑定的功能,熟练运用Repeater控件后,其它类似的数据绑定控件就很简单了。接着我们上篇博客的内...
  • zhang_xinxiu
  • zhang_xinxiu
  • 2014年03月28日 09:28
  • 24447

Datalist控件的详细用法(一)

使用DataList控件   本章内容:          1、理解事件冒泡          2、使用模板          3、在DataList中显示数据          4、在Dat...
  • liuwei1128
  • liuwei1128
  • 2014年03月14日 21:34
  • 3106

DataGrid中的全选和单选的功能

在WPF中DataGrid和CheckBox的联合使用是非常常见的,但是在DataGrid中怎 么实现全选和部分选择的功能并没有现成的控件去使用。要想实现该功能,必须人工通 过代码来完成。关于实现...
  • u010375663
  • u010375663
  • 2015年11月28日 10:20
  • 2007

粗略区分Gridview,repeater,datelist数据控件的差异

比较GridView Repeater DataList三种绑定控件、从灵活性和执行效率上综合考虑,Repeater当属第一。gridview功能最强大,但是对待嵌套绑定问题、疑难杂症,还是用Data...
  • jintougao
  • jintougao
  • 2014年01月24日 10:04
  • 1375

Flex中DataGrid实现列(包括头部)中加入CheckBox全选功能 几种实现方法

 在DataGrid中实现列中加入CheckBox这种用法很常见,项目中也经常会用到,在网上搜了下基本就是实现itemRender.但是 感觉网上提供的实现上好些地方都是多余的 经过自己的改造感...
  • u011589095
  • u011589095
  • 2014年08月14日 14:53
  • 1102

数据绑定——DataGrid

绑定数据
  • wgp15732622312
  • wgp15732622312
  • 2016年05月15日 17:14
  • 518
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Javascript在客户端实现遍历datagrid,DataList控件,像MSN中的全选
举报原因:
原因补充:

(最多只允许输入30个字)