GridView 树形结构分组的功能
在“会飞的鱼”博客中看到GridView实现树形结构的代码，经过修改，添加了树形结构中的复选框功能，欢迎吐槽。
源地址：http://www.cnblogs.com/chhuic/archive/2012/05/11/2495577.html
1 <script type="text/javascript"> 2 //树节点相关控制 3 <!-- 4 function hideChildren(node) { 5 var level = parseInt(node.getAttribute("level")); 6 var nextNode = node.nextSibling; 7 while (nextNode != null && parseInt(nextNode.getAttribute("level")) > level) { 8 nextNode.style.display = "none"; nextNode = nextNode.nextSibling; 9 } 10 } 11 function showChildren(node) { 12 var level = parseInt(node.getAttribute("level")); 13 var id = node.getAttribute("id"); 14 var nextNode = node.nextSibling; 15 while (nextNode != null && parseInt(nextNode.getAttribute("level")) > level) { 16 if (nextNode.getAttribute("pid") == id) { 17 if (node.getAttribute("expand") == "1") { 18 nextNode.style.display = ""; 19 showChildren(nextNode); 20 } 21 else { 22 nextNode.style.display = "none"; 23 } 24 } 25 nextNode = nextNode.nextSibling; 26 } 27 } 28 function setExpand(sender) { 29 var curNode = sender.parentNode.parentNode; 30 if (curNode.getAttribute("expand") == "1") { 31 curNode.setAttribute("expand", "0"); 32 sender.src = "../../Common/Images/Down.gif"; 33 hideChildren(curNode); 34 } 35 else { 36 curNode.setAttribute("expand", "1"); 37 sender.src = "../../Common/Images/Top.gif"; 38 showChildren(curNode); 39 } 40 } 41 function setCheck(sender){ 42 var curNode = sender.parentNode.parentNode; 43 if (curNode.getAttribute("expand") == "1") { 44 var level = parseInt(curNode.getAttribute("level")); 45 var nextNode = curNode.nextSibling; 46 while (nextNode != null && parseInt(nextNode.getAttribute("level")) > level) { 47 48 var a=nextNode.firstChild.firstChild; 49 a.checked = sender.checked; 50 nextNode = nextNode.nextSibling; 51 } 52 53 } 54 } 55 //--> 56 </script>
1 <asp:GridView ID="gvList" runat="server" AutoGenerateColumns="False" CssClass="datatbl" 2 Style="width: 900px" DataKeyNames="ID,PID,Level,HasChild,processName,process,content" TreeColumnIndex="0" 3 OnRowDataBound="gvList_RowDataBound"> 4 <Columns> 5 <asp:TemplateField HeaderText="检查编号"> 6 <ItemTemplate> 7 <asp:CheckBox ID="cboProcess" onclick="setCheck(this)" runat="server" /> 8 <asp:Label ID="Label1" runat="server" Text='<%# Bind("process") %>'></asp:Label> 9 </ItemTemplate> 10 <HeaderStyle Width="200px" /> 11 </asp:TemplateField> 12 <asp:BoundField HeaderText="检查内容" DataField="content"> 13 <HeaderStyle Width="700px" /> 14 </asp:BoundField> 15 <asp:BoundField DataField="level" HeaderText="level" Visible="False" /> 16 </Columns> 17 <EmptyDataTemplate> 18 <div class="tip"> 19 暂无记录！</div> 20 </EmptyDataTemplate> 21 <HeaderStyle HorizontalAlign="Center" CssClass="head"></HeaderStyle> 22 <PagerStyle HorizontalAlign="Right"></PagerStyle> 23 <AlternatingRowStyle CssClass="alter"></AlternatingRowStyle> 24 <RowStyle CssClass="item"></RowStyle> 25 </asp:GridView>
1 protected void gvList_RowDataBound(object sender, GridViewRowEventArgs e) 2 { 3 if (e.Row.RowType == DataControlRowType.DataRow) 4 { 5 # region 生成树形结构 6 string id = gvList.DataKeys[e.Row.RowIndex]["ID"].ToString(); 7 string pid = gvList.DataKeys[e.Row.RowIndex]["PID"].ToString(); 8 string level = gvList.DataKeys[e.Row.RowIndex]["Level"].ToString(); 9 string checkNo = gvList.DataKeys[e.Row.RowIndex]["process"].ToString(); 10 11 12 //增加节点的属性 13 e.Row.Attributes.Add("id", id); 14 e.Row.Attributes.Add("pid", pid); 15 e.Row.Attributes.Add("level", level); 16 e.Row.Attributes.Add("expand", "1"); 17 int indent = (int.Parse(level) - 1) * 20; 18 //判断是否有子节点 19 if (gvList.DataKeys[e.Row.RowIndex]["HasChild"].ToString() == "1") 20 { 21 //设置父节点前面的图片和点击事件 22 HtmlImage img = new HtmlImage(); 23 img.Src = "../../Common/Images/Top.gif"; 24 img.Attributes.Add("onclick", "setExpand(this)"); 25 img.Style.Add("cursor", "pointer"); 26 e.Row.Cells[0].Controls.AddAt(0, img); 27 e.Row.Cells[0].Style["font-weight"] = "bold"; 28 indent += 5; 29 } 30 else 31 { 32 indent += 16; 33 } 34 35 e.Row.Cells[0].Style["padding-left"] = indent + "px"; 36 e.Row.Cells[0].Controls.Add(new LiteralControl(e.Row.Cells[0].Text)); 37 # endregion 38 e.Row.Attributes["onmouseover"] = "style.backgroundColor='#F2FDDB'"; 39 e.Row.Attributes["onmouseout"] = "style.backgroundColor=''"; 40 } 41 42 }
