GridView 树形结构分组的功能
在“会飞的鱼”博客中看到GridView实现树形结构的代码,经过修改,添加了树形结构中的复选框功能,欢迎吐槽。
源地址:http://www.cnblogs.com/chhuic/archive/2012/05/11/2495577.html
<script type="text/javascript">
//树节点相关控制
<!--
function hideChildren(node) {
var level = parseInt(node.getAttribute("level"));
var nextNode = node.nextSibling;
while (nextNode != null && parseInt(nextNode.getAttribute("level")) > level) {
nextNode.style.display = "none"; nextNode = nextNode.nextSibling;
}
}
function showChildren(node) {
var level = parseInt(node.getAttribute("level"));
var id = node.getAttribute("id");
var nextNode = node.nextSibling;
while (nextNode != null && parseInt(nextNode.getAttribute("level")) > level) {
if (nextNode.getAttribute("pid") == id) {
if (node.getAttribute("expand") == "1") {
nextNode.style.display = "";
showChildren(nextNode);
}
else {
nextNode.style.display = "none";
}
}
nextNode = nextNode.nextSibling;
}
}
function setExpand(sender) {
var curNode = sender.parentNode.parentNode;
if (curNode.getAttribute("expand") == "1") {
curNode.setAttribute("expand", "0");
sender.src = "../../Common/Images/Down.gif";
hideChildren(curNode);
}
else {
curNode.setAttribute("expand", "1");
sender.src = "../../Common/Images/Top.gif";
showChildren(curNode);
}
}
function setCheck(sender){
var curNode = sender.parentNode.parentNode;
if (curNode.getAttribute("expand") == "1") {
var level = parseInt(curNode.getAttribute("level"));
var nextNode = curNode.nextSibling;
while (nextNode != null && parseInt(nextNode.getAttribute("level")) > level) { var a=nextNode.firstChild.firstChild;
a.checked = sender.checked;
nextNode = nextNode.nextSibling;
} }
}
//-->
</script>
Script Code
<asp:GridView ID="gvList" runat="server" AutoGenerateColumns="False" CssClass="datatbl"
Style="width: 900px" DataKeyNames="ID,PID,Level,HasChild,processName,process,content" TreeColumnIndex="0"
OnRowDataBound="gvList_RowDataBound">
<Columns>
<asp:TemplateField HeaderText="检查编号">
<ItemTemplate>
<asp:CheckBox ID="cboProcess" onclick="setCheck(this)" runat="server" />
<asp:Label ID="Label1" runat="server" Text='<%# Bind("process") %>'></asp:Label>
</ItemTemplate>
<HeaderStyle Width="200px" />
</asp:TemplateField>
<asp:BoundField HeaderText="检查内容" DataField="content">
<HeaderStyle Width="700px" />
</asp:BoundField>
<asp:BoundField DataField="level" HeaderText="level" Visible="False" />
</Columns>
<EmptyDataTemplate>
<div class="tip">
暂无记录!</div>
</EmptyDataTemplate>
<HeaderStyle HorizontalAlign="Center" CssClass="head"></HeaderStyle>
<PagerStyle HorizontalAlign="Right"></PagerStyle>
<AlternatingRowStyle CssClass="alter"></AlternatingRowStyle>
<RowStyle CssClass="item"></RowStyle>
</asp:GridView>
HTML Code
protected void gvList_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
# region 生成树形结构
string id = gvList.DataKeys[e.Row.RowIndex]["ID"].ToString();
string pid = gvList.DataKeys[e.Row.RowIndex]["PID"].ToString();
string level = gvList.DataKeys[e.Row.RowIndex]["Level"].ToString();
string checkNo = gvList.DataKeys[e.Row.RowIndex]["process"].ToString(); //增加节点的属性
e.Row.Attributes.Add("id", id);
e.Row.Attributes.Add("pid", pid);
e.Row.Attributes.Add("level", level);
e.Row.Attributes.Add("expand", "");
int indent = (int.Parse(level) - ) * ;
//判断是否有子节点
if (gvList.DataKeys[e.Row.RowIndex]["HasChild"].ToString() == "")
{
//设置父节点前面的图片和点击事件
HtmlImage img = new HtmlImage();
img.Src = "../../Common/Images/Top.gif";
img.Attributes.Add("onclick", "setExpand(this)");
img.Style.Add("cursor", "pointer");
e.Row.Cells[].Controls.AddAt(, img);
e.Row.Cells[].Style["font-weight"] = "bold";
indent += ;
}
else
{
indent += ;
} e.Row.Cells[].Style["padding-left"] = indent + "px";
e.Row.Cells[].Controls.Add(new LiteralControl(e.Row.Cells[].Text));
# endregion
e.Row.Attributes["onmouseover"] = "style.backgroundColor='#F2FDDB'";
e.Row.Attributes["onmouseout"] = "style.backgroundColor=''";
} }
C# Code
GridView 树形结构分组的功能的更多相关文章
- 在论坛中出现的比较难的sql问题:8(递归问题 树形结构分组)
原文:在论坛中出现的比较难的sql问题:8(递归问题 树形结构分组) 最近,在论坛中,遇到了不少比较难的sql问题,虽然自己都能解决,但发现过几天后,就记不起来了,也忘记解决的方法了. 所以,觉得有必 ...
- Extjs实现树形结构三连选
当项目中需要一个部门人员选择或者省市县地域连选时,就需要树形结构的连选. 再此,写了一个简单的树形结构三连选功能,模拟从后台读取数据和处理数据(欢迎大家交流指正). 代码如下: 循环创建三棵树,其中只 ...
- 「SQL归纳」树形结构表的存储与查询功能的实现——通过路径方法(非递归)
一.树形结构例子分析: 以360问答页面为例:http://wenda.so.com/c/ 我们通过观察URL,可以明确该页面的数据以树形结构存储,下面三块模块分别为: ①根节点 ②根节点的第一层子节 ...
- VBA读取文件夹下所有文件夹及文件内容,并以树形结构展示
Const TR_LEVEL_MARK = "+"Const TR_COL_INDEX = "A"Const TR_COL_LEVEL = "E&qu ...
- 树形结构的数据库表Schema设计-基于左右值编码
树形结构的数据库表Schema设计 程序设计过程中,我们常常用树形结构来表征某些数据的关联关系,如企业上下级部门.栏目结构.商品分类等等,通常而言,这些树状结构需要借助于数据库完 成持久化.然而目前的 ...
- Atitit.各种 数据类型 ( 树形结构,表形数据 ) 的结构与存储数据库 attilax 总结
Atitit.各种 数据类型 ( 树形结构,表形数据 ) 的结构与存储数据库 attilax 总结 1. 数据结构( 树形结构,表形数据,对象结构 ) 1 2. 编程语言中对应的数据结构 jav ...
- 使用ztree.js,受益一生,十分钟学会使用tree树形结构插件
看到ztree.js,这几个字眼,毋庸置疑,那肯定就是tree树形结构了,曾经的swing年代有jtree,后来jquery年代有jstree和treeview,虽然我没写过,但是我见过,一些小功能做 ...
- 部门树形结构,使用Treeview控件显示部门
部门树形结构.设计张部门表用于存储部门编码.名称.上级部门id,使用Treeview控件显示部门树,并实现部门增删改.移动.折叠等功能.特别提示,部门有层级关系,可用donetbar的adtree控件 ...
- jQuery+zTree加载树形结构菜单
jQuery+zTree加载树形结构菜单 由于项目中需要设计树形菜单功能,经过一番捣腾之后,终于给弄出来了,所以便记下来,也算是学习zTree的一个总结吧. zTree的介绍: 1.zTree 是利用 ...
随机推荐
- ABP源码分析六:依赖注入的实现
ABP的依赖注入的实现有一个本质两个途径:1.本质上是依赖于Castle这个老牌依赖注入的框架.2.一种实现途径是通过实现IConventionalDependencyRegistrar的实例定义注入 ...
- ★Kali信息收集~ 1.Google Hacking + Github Hacking
一.google hacking site site:cnblogs.com 毒逆天 intitle intitle:login allintitle allintitle:index of alli ...
- “前.NET Core时代”如何实现跨平台代码重用 ——程序集重用
除了在源代码层面实现共享("前.NET Core时代"如何实现跨平台代码重用 --源文件重用)之外,我们还可以跨平台共享同一个程序集,这种独立于具体平台的"中性" ...
- 开始学nodejs —— 调试篇
新学习一种技术,肯定会遇到很多坑,我们需要找到这些坑,弄清楚这些坑出现的原因和其中的原理.这种操作就叫做调试. 程序调试的方法和工具多种多样,在这里我总结一下我在学习nodejs的过程中,学到的和用到 ...
- 设计模式(十一):从文Finder中认识"组合模式"(Composite Pattern)
上一篇博客中我们从从电影院中认识了"迭代器模式"(Iterator Pattern),今天我们就从文件系统中来认识一下“组合模式”(Composite Pattern).说到组合模 ...
- 无限循环轮播图之结构布局(原生JS)
html部分 <div class="box" id="box"> <ul> <li><img src="i ...
- C#/VB.NET Excel数据分列
C#/VB.NET Excel数据分列 有时候我们需要将保存在Excel单元格中的组合型数据拆分为多列(如将全名拆分为姓和名两列)以方便我们处理.记忆或保存.为了避免重复和大量的手动输入工作,Exce ...
- 基於tiny4412的Linux內核移植--- 中斷和GPIO學習(2)
作者 彭東林 pengdonglin137@163.com 平臺 tiny4412 ADK Linux-4.4.4 u-boot使用的U-Boot 2010.12,是友善自帶的,爲支持設備樹和uIma ...
- 【分布式】Zookeeper应用场景
一.前言 在上一篇博客已经介绍了Zookeeper开源客户端的简单实用,本篇讲解Zookeeper的应用场景. 二.典型应用场景 Zookeeper是一个高可用的分布式数据管理和协调框架,并且能够很好 ...
- context:component-scan" 的前缀 "context" 未绑定。
SpElUtilTest.testSpELLiteralExpressiontestSpELLiteralExpression(cn.zr.spring.spel.SpElUtilTest)org.s ...