C#　GridView树状结构显⽰
下⾯的树形结构代码需要GridVIew中的数据要求是按照上下级关系已经排列好的顺序，⽐如：
GridView
ID ParentID Name 1 0 ⽗1 2 1 ⽗1⼦1 3 1 ⽗1⼦2 4 3 ⽗1⼦2孙1 5 3 ⽗1⼦2孙2 6 0 ⽗2 7 6 ⽗2⼦
⽗⼦项关系⽤递归函数实现
protected void gvList_RowDataBound(object sender, GridViewRowEventArgs e)
{
if(e.Row.RowType==DataControlRowType.DataRow)
{
#region 数据绑定
DataRowView rowView = (DataRowView) e.Row.DataItem;
Label lblParentName=e.Row.FindControl("lblParentName") as Label;
lblParentName.Text = GetParentName(Convert.ToInt32(rowView["ParentID"]));
Button btnDel = e.Row.FindControl("btnDel") as Button;
btnDel.Visible = (Convert.ToInt32(rowView["ParentID"]) != 0);
#endregion
#region 树形结构
string id = rowView["ID"].ToString();
string pid = rowView["ParentID"].ToString();
string level = "1";
e.Row.Attributes.Add("id",id);
e.Row.Attributes.Add("pid",pid);
e.Row.Attributes.Add("expand","1");
if (rowView["ParentID"].ToString() == "0")
{
var img = new HtmlImage {Src = "../../Image/Tree/minimize.gif"};
img.Attributes.Add("onclick","setExpand(this)");
img.Style.Add("cursor","pointer");
e.Row.Cells[1].Controls.Add(img);
}
else
{
e.Row.Cells[1].Style["padding-left"] = "20px";
level = "2";
}
e.Row.Attributes.Add("level",level);
#endregion
}
}
以下是前台js控制节点电机事件中的显⽰和隐藏效果(判断代码“deType==1”部分是因为不同浏览器可能会产⽣多余的空⽩换⾏⽽使nextNode不为空，但是nodeType为其他值)
<script type="text/javascript">gridview不显示
//树节点相关控制
function hideChildren(node) {
var level = Attribute("level"));
var nextNode = Sibling;
while (nextNode != null && deType==1&& Attribute("level")) > level) {
nextNode.style.display = "none"; nextNode = Sibling;
}
}
function showChildren(node) {
var level = Attribute("level"));
var id = Attribute("id");
var nextNode = Sibling;
while (nextNode != null && deType==1&& Attribute("level")) > level) {
if (Attribute("pid") == id) {
if (Attribute("expand") == "1") {
nextNode.style.display = "";
showChildren(nextNode);
}
else {
nextNode.style.display = "none";
}
}
nextNode = Sibling;
}
}
function setExpand(sender) {
var curNode = sender.parentNode.parentNode;
if (Attribute("expand") == "1") {
curNode.setAttribute("expand", "0");
sender.src = "../../Image/Tree/maximize.gif";
hideChildren(curNode);
}
else {
curNode.setAttribute("expand", "1");
sender.src = "../../Image/Tree/minimize.gif";
showChildren(curNode);
}
}
</script>
<asp:gridview id="gvList" onrowcommand="gvList_RowCommand" onrowdatabound="gvList_RowDataBound" emptydatatext="暂⽆记录！" datakeynames="ID" cssclass="grid" autogeneratecolumns="false" runat="server">
<columns>
<asp:boundfield itemstyle-horizontalalign="Center" visible="false" datafield="ID" itemstyle-width="20" headertext="ID">
<asp:boundfield itemstyle-horizontalalign="left" datafield="DeptNo" itemstyle-width="200px" headertext="编号">
<asp:boundfield itemstyle-horizontalalign="Center" datafield="DeptName" itemstyle-width="200px" headertext="名称">
<asp:templatefield headertext="上级" headerstyle-width="200px">
<itemstyle wrap="false" horizontalalign="Center" width="100px">
<itemtemplate>
<asp:label id="lblParentName" runat="server"></asp:label>
</itemtemplate>
</itemstyle></asp:templatefield>
<asp:templatefield headertext="操作" headerstyle-width="200px">
<itemstyle horizontalalign="center" width="200px">
<itemtemplate>
<table><tbody><tr><td > <input class="btnGrid" title="修改信息" value="编辑" type="button" />
</td><td ><asp:button id="btnDel" cssclass="btnGrid" runat="server" commandargument="<%#Eval('ID') %>" tooltip="删除信息" commandname="Delet" onclientclick="return confirm('确定删除选中记录吗？')" text="删除">
</asp:button></td></tr></tbody></table>
</itemtemplate>
</itemstyle></asp:templatefield>
</asp:boundfield></asp:boundfield></asp:boundfield></columns>
</asp:gridview>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。