动态创建树视图 [英] Dynamically create a treeview

查看：21
本文介绍了动态创建树视图的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试使用 c# 和 asp.net 动态创建树视图.

我使用 populate on demand 属性创建了一个延迟加载树视图.

><asp:TreeView ID="treeView1" runat="server">OnTreeNodePopulate="treeview1_TreeNodePopulate"></asp:TreeView>

在代码后面我已经加载了我的数据，但最初我填充了父节点.我想要实现的是，当我单击父节点时，我进行回发，然后填充其子节点，然后再次填充其子节点，等等.我有成千上万的数据，所以我不希望由于性能而填充所有数据.这就是为什么我只想根据所选节点填充节点子节点的原因.请参见下面的示例:

>彼得- - >用户 1- - >user2- - >user3- - >用户密码- - >用户ID>约翰>大卫>杰克- - >用户 1- - >user2- - >用户密码- - >用户ID- - >权限>劳拉- - >行政- - >权限-- >用户 1-- >用户 2- - >用户密码- - >用户ID- - >权限>...>...>...

如您所见，可以有多个父节点和多个层.这些将根据我传递给 DB 的内容动态填充.每次我单击节点时，它都会扩展节点并使用回发填充其子节点，然后当您再次单击其子节点时，它将执行回发并再次填充其子节点等.所以我需要有关如何创建动态树视图的帮助.

c#:

private void LoadTreeview(){//加载数据//从数据库中获取数据.//遍历列表并构建其父节点.foreach(列表中的var dxm){TreeNode tnParent = CheckNodeExist(dxm.Node);//我检查是否存在.如果(tnParent== null){TreeNode tn = new TreeNode();tn.Text = dxm.Node;tn.Value = dxm.Id.ToString();tn.SelectAction = TreeNodeSelectAction.None;tn.Collapse();treeView1.Nodes.Add(tn);tn.PopulateOnDemand = 真；//延迟加载tnParent = tn;}}

在页面加载时调用上面的这个方法.

在 TreeNodePopulateEvent 上:(当一个节点被点击时)

protected void treeview1_TreeNodePopulate(object sender, TreeNodeEventArgs e){ICollection<ITEMS>list = new Collection();list = GetData(e.Node.Text);//传入您选择的节点，如果该节点确实有任何子节点，这将检查数据库.如果是这样，将返回子节点.foreach(列表中的var dxm){TreeNode tnChild = CheckNodeExist(dxm.Node);如果(tnChild == null){TreeNode tn = new TreeNode();tn.Text = dxm.Node;tn.Value = dxm.Id.ToString();tn.SelectAction = TreeNodeSelectAction.None;tn.Collapse();tn.PopulateOnDemand = 真；tnChild = tn;tnChild.ChildNodes.Add(tnChild);}}}

解决方案

我相信您正在寻找 SelectedNodeChanged 事件.您应该能够在此事件中加载您的子节点.基本上，每次您通过单击选择一个节点时，都会触发此事件.

你的aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="服务器"><title></title><身体><form id="form1" runat="server"><div id="div1" runat="服务器">

<asp:TreeView ID="TreeView1" runat="server"onselectednodechanged="TreeView1_SelectedNodeChanged"></asp:TreeView></表单>

你的代码隐藏

使用系统；使用 System.Collections.Generic;使用 System.Linq；使用 System.Web；使用 System.Web.UI；使用 System.Web.UI.WebControls;公共部分类 _Default : System.Web.UI.Page{protected void Page_Load(object sender, EventArgs e){如果 (!Page.IsPostBack){TreeView1.Nodes.Add(new TreeNode("Node1"));TreeView1.Nodes[0].ChildNodes.Add(new TreeNode("ChildNode"));}}protected void TreeView1_SelectedNodeChanged(object sender, EventArgs e){Response.Write(TreeView1.SelectedNode.Text);}}

I am trying to create a treeview dynamically using c# and asp.net.

I have created a lazy load treeview using the populate ondemand attribute. 

>  <asp:TreeView ID="treeView1"  runat="server" 
>              OnTreeNodePopulate="treeview1_TreeNodePopulate"></asp:TreeView>

Behind code I have loaded my data but initially I populate the parent nodes. What I want to achieve is when i click on parent node I then do a postback and then populate its child and then again populate its child's and so now. I have thousands of data so i dont want all data to be populated due to performance. So thats the reason why I only want to populate the node childs based on selected node. See example below:

>Peter
    - - >user1
    - - >user2
    - - >user3
       - - >userPassword
       - - >userId
>john
>david
>Jack
    - - >user1
    - - >user2
       - - >userpassword
       - - >userId
       - - >Permissions
>Laura 
    - - > admin
    - - > permissions
       -- > user1
       -- > user2
         - - >userpassword
             - - >userId
             - - >Permissions           
>...
>...
>...

As you can see there can be multiple parent nodes and multiple layers. These will be populated dynically based on what i pass in to DB. Everytime i click on node it will expand the node and populate its child using postback and then when you click on its child again it will do a postback and populate its child again etc. So i wanted help on how to create a dynamic treeview.

c# :

private void LoadTreeview()
{
 //Load data
 // Get data from DB.
 //loop through the list and build its parent nodes.
  foreach (var dxm in list)
  {
                TreeNode tnParent = CheckNodeExist(dxm.Node); //I check to see if exists.
                if (tnParent== null)
                {
                    TreeNode tn = new TreeNode();
                    tn.Text = dxm.Node;
                    tn.Value = dxm.Id.ToString();
                    tn.SelectAction = TreeNodeSelectAction.None;
                    tn.Collapse();
                    treeView1.Nodes.Add(tn);
                    tn.PopulateOnDemand = true; //lazy load
                    tnParent= tn;
                }

}

This method above is called on page load.

On TreeNodePopulateEvent: (when a node is clicked on)

protected void treeview1_TreeNodePopulate(object sender, TreeNodeEventArgs e)
        {
            ICollection<ITEMS> list = new Collection<ITEMS>();           

            list = GetData(e.Node.Text); //pass in the node you have selected  this will go and check in DB if the node does have any child nodes. If so will return with child nodes.

            foreach (var dxm in list)
            {

                TreeNode tnChild = CheckNodeExist(dxm.Node);
                if (tnChild == null)
                {
                    TreeNode tn = new TreeNode();
                    tn.Text = dxm.Node;
                    tn.Value = dxm.Id.ToString();
                    tn.SelectAction = TreeNodeSelectAction.None;
                    tn.Collapse();

                    tn.PopulateOnDemand = true;
                    tnChild = tn;
                    tnChild.ChildNodes.Add(tnChild);                  

                }
            }
        }

解决方案

I believe you are looking for the SelectedNodeChanged event. You should be able to load your child nodes in this event. Basically this event will be fired everytime you select a node by clicking on it.

Your aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div id="div1" runat="server">

    </div>

    <asp:TreeView ID="TreeView1" runat="server" 
        onselectednodechanged="TreeView1_SelectedNodeChanged">

    </asp:TreeView>

    </form>
</body>
</html>

Your codebehind

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            TreeView1.Nodes.Add(new TreeNode("Node1"));
            TreeView1.Nodes[0].ChildNodes.Add(new TreeNode("ChildNode"));
        }

    }


    protected void TreeView1_SelectedNodeChanged(object sender, EventArgs e)
    {
        Response.Write(TreeView1.SelectedNode.Text);
    }
}

这篇关于动态创建树视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
C#/.NET最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆