既然是动态的载入数据的TreeView,那么服务器端的数据也同时应该以一种树型结构来保存。通过客户端发送节点标识,返回该节点下的子节点数据从而动态生成子节点。下面是一个模拟文件夹数据存放结构的服务器端数据获取示例。
我们设计这样一张数据库表来存放文件夹数据结构:
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
// 实际上上面数据来之于存放在数据库中的一个FTP服务器的目录结构信息
数据库表预览如下:
DirIndex | Name | Size | Date |
FatherID
| ID |
---|---|---|---|---|---|
1
| Movie |
-1
|
Mar 29 07:23
|
0
|
1
|
2
| DV作品 |
-1
|
Mar 22 10:28
|
1
|
2
|
3
| xjtu我的黄金时代-vivi |
-1
|
Mar 22 10:29
|
2
|
3
|
-1
| MyGoldenAgeA.rm |
1.52E+08
|
Mar 14 15:49
|
3
|
4
|
-1
| MyGoldenAgeB.rm |
1.38E+08
|
Mar 14 15:49
|
3
|
5
|
-1
| 花絮.rm |
65196399
|
Mar 14 15:49
|
3
|
6
|
4
| 夏日勇气 |
-1
|
Mar 22 10:28
|
2
|
7
|
-1
| 夏日勇气.rm |
1.91E+08
|
Mar 14 20:31
|
4
|
8
|
5
| 大陆 |
-1
|
Apr 2 02:01
|
1
|
9
|
6
| 爱情麻辣烫 |
-1
|
Mar 22 10:28
|
5
|
10
|
-1
| 001.rm |
1.07E+08
|
Mar 15 08:35
|
6
|
11
|
-1
| 002.rm |
72386955
|
Mar 15 08:42
|
6
|
12
|
7
| 大鸿米店-leonado |
-1
|
Mar 29 10:07
|
5
|
13
|
-1
| 01.rm |
1.59E+08
|
Mar 29 10:08
|
7
|
14
|
-1
| 02.rm |
91197989
|
Mar 29 10:08
|
7
|
15
|
...
| ... |
...
|
...
|
...
| ... |
这里ID是数据库主键,我们将其作为TreeNode的标识,在展开一个TreeNode时,向服务器发送这个标识,服务器返回TreeNode的子节点信息。关于这个返回的数据格式,为了便于客户端处理,我们把子节点信息以一个二维数组的方式返回给客户端,这样一来客户端只需要执行eval(data),就可以得到一个存放TreeView子节点的原数据对象。
假如我们使用, http://localhost/TreeView/GetTreeNodes.aspx?nid=1向服务器请求数据,那么服务器将返回:
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
如果我们使用同步xmlhttp来取这段数据,这个返回格式已经非常的精简并且便于使用了。可是如果是以xmlhttp的异步执行方式来展开TreeView的节点,那么为了防止客户端插入子节点出错,我们还需要在返回数据中同时输出被Load节点的标志,以便于在异步回调函数执行时,准确确定子节点的加载位置。所以最后服务器返回的子节点信息格式为:
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
附服务器端代码示例:
![ContractedBlock.gif](https://i-blog.csdnimg.cn/blog_migrate/0be121fa5b8988fbabbbc526af3b0fc0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![ContractedBlock.gif](https://i-blog.csdnimg.cn/blog_migrate/0be121fa5b8988fbabbbc526af3b0fc0.gif)
![dot.gif](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
注意,.aspx文件中除了:
![ExpandedBlockStart.gif](https://i-blog.csdnimg.cn/blog_migrate/34031c708bfe702fe82d01ff5c6593aa.gif)
![None.gif](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
什么也不要留!!!
本文转自博客园鸟食轩的博客,原文链接:http://www.cnblogs.com/birdshome/,如需转载请自行联系原博主。