rad treeview异步加载树控件

rad控件还是很不错的，功能强大的一腿。

下面介绍下treeview控件，大家可以先到www.telrik.com上面看看，很多控件。

1.引用dll

2.拷贝radcontrols/treeview的图片样式等到你自己的web根目录下

3.前台页面

1. // 点击树控件后触发Js的脚本
2. function AfterClick(node)
3.             {
5.                 alert(node.Value + "|" + node.Text);
6.                 }
8. <div>
9. <radt:radtreeview id="treeDept" Runat="server" ExpandDelay="0" OnNodeExpand="treeDept_NodeExpand"
10. RetainScrollPosition="False" Height="420px" AfterClientClick="AfterClick"> </radt:radtreeview> </div> 

4.后台页面

1. /// <summary>
2.         /// 页面初始化
3.         /// </summary>
4.         /// <param name="sender"></param>
5.         /// <param name="e"></param>
6.         private void Page_Load(object sender, System.EventArgs e)
7.         {
8.             
9.             // 在此处放置用户代码以初始化页面
10.             if (!Page.IsPostBack && !treeDept.IsCallBack)
11.             {
12.                 // 加载根节点 
13.                 LoadRootNodes();
14.                 Session["treeViewState"] = treeDept.GetXml();
15.                 // 加载信息
16.                 treeDept.LoadingMessagePosition = LoadingMessagePosition.BeforeNodeText;
17.                 treeDept.LoadingMessageCssClass = "LoadingMessageBlue";
18.                 treeDept.LoadingMessage = "(loading ..)";
19.                 
20.             }
21.         }
23. /// <summary>
24.         /// 加载根节点
25.         /// </summary>
26.         private void LoadRootNodes()
27.         {
28.             
29.             //string isValid = "1";
30.             // 获取第一层部门数据
31.             DataTable dt = GetOneDept();
32.             
33.             // 遍历第一层节点并依次添加
34.             foreach (DataRow row in dt.Rows)
35.             {
36.                 RadTreeNode node = new RadTreeNode();
37.                 node.Text   = row["DeptName"].ToString();
38.                 node.Value  = row["DeptNo"].ToString();
39.                 //node.Category = "Some Category";
40.                 node.ExpandMode = ExpandMode.ServerSideCallBack;
41.                 node.ToolTip =  "["+ node.Value + "]" + node.Text;
42.                 // 增加节点
43.                 treeDept.Nodes.Add(node);
44.             }
45.         }
46.         /// <summary>
47.         /// 异步填充节点数据
48.         /// </summary>
49.         /// <param name="o">事件源</param>
50.         /// <param name="e">参数信息</param>
51.         protected void treeDept_NodeExpand(object o, RadTreeNodeEventArgs e)
52.         {
53.             
54.             // 异步添加子节点
55.             AddChildNodes(e.NodeClicked);
56.             // 将子节点存入session中
57.             string treeViewState = (string)Session["treeViewState"];
58.             RadTreeView cachedTreeView = new RadTreeView();
59.             cachedTreeView.LoadXmlString(treeViewState);
60.             RadTreeNode cachedNodeClicked = cachedTreeView.FindNodeByValue(e.NodeClicked.Value);
61.             // cachedNodeClicked.Checked = e.NodeClicked.Checked;
62.             AddChildNodes(cachedNodeClicked);
63.             cachedNodeClicked.ExpandMode = ExpandMode.ClientSide;
64.             cachedNodeClicked.Expanded = true;
65.             Session["treeViewState"] = cachedTreeView.GetXml();
67.         }
69.         /// <summary>
70.         /// 异步添加子节点
71.         /// </summary>
72.         /// <param name="node">RadTreeNode</param>
73.         private void AddChildNodes(RadTreeNode node)
74.         {
75.             //DataSet ds = new DataSet();
76.             DataTable dt = new DataTable();
78. // 获取第一层部门下的部门
79.             dt = this.GetOtherDept(node.Value);
80.             
81.             // 遍历DataTable,加载子节点
82.             foreach (DataRow row in dt.Rows)
83.             {
84.                 RadTreeNode childNode = new RadTreeNode();
85.                 childNode.Text  = row["DeptName"].ToString();
86.                 childNode.Value = row["DeptNo"].ToString();
87.                 // 判断第二层是否有子节点
88.                 if (node.Level ==0 && GetTreeDept(childNode.Value).Rows.Count > 0)
89.                 {
90.                     childNode.ExpandMode = ExpandMode.ServerSideCallBack;
91.                 }
92.                 // ToolTip显示
93.                 childNode.ToolTip = "["+ childNode.Value + "]" + childNode.Text;
94.                 
95.                 node.Nodes.Add(childNode);
96.             }
97.         }

这样就Ok了。

可以根据自己的喜好设置样式，大家自己研究吧。