列表树形结构显示

id name content parentid
1001 电气 aaa 0
1002 土建 bbb 0
1003 电气一级节点 ccc 1001
1004 电气一级节点二 ddd 1001
1005 电气二级节点 eee 1003
1006 电气二级节点二 fff 1003
1007 土建一级节点 ggg 1002

需要在页面上以列表的形式显示:

电气        aaa      
    电气一级节点     bbb  
    电气二级节点      eee
    电气二级节点二       fff
    电气一级节点二   ccc     
土建   bbb 
    土建一级节点      ggg 

有那个兄弟帮忙解决下,先谢过!

0

6个回答

[code="java"]
function getTree(parentid,blackSpace){
//使用同步Ajax方式请求菜单数据
var conn = Ext.lib.Ajax.getConnectionObject().conn;
conn.open("POST", 'logindata.jsp?parentid='+parentid+'&date='+new Date().getTime(), false); //使用同步方式时设置第三个参数为false
conn.send(null);
var contentTable = document.getElementById("contentTable");
if (conn.status == "200"){
var json = Ext.util.JSON.decode(conn.responseText);

            if (json.length == 0){
                return;
            }
            for (var i=0; i<json.length; i++){
                var tr = contentTable.insertRow();
                var nameTd = tr.insertCell();
                var contentTd = tr.insertCell();
                nameTd.innerHTML = blackSpace+json[i].name;
                contentTd.innerHTML = blackSpace+json[i].content;
                                    getTree(json[i].id,blackSpace+"&nbsp;&nbsp;");
            }
        }else{
            showExtAlert("消息提示", "获取菜单失败,请检测网络是否畅通", Ext.MessageBox.WARNING);
        }
    }





[/code]
兄弟上面的代码可以帮你自动创建出一个树形结构,我的是用Ext中的ajax,你只需要把我ajax调用地方改为其它你用的ajax框架即可。后台数据格式可以是最好使用json格式,标准化。有数据的格式:[{id:1001,name:'电气',content:'aaa',parentid:0},{id:1002,name:'土建',content:'bbb',parentid:0}]
无数据的格式:[]
0

你将查询结果以一个list返回,然后在客户端用js来解析它。

先写一下如下的列表结构

  • 0级
    • 一级
      • 二级
      • 二级
      • 二级

这个把它搞成js数组:逗号自己补满。。。
var a = [

[1001 ,电气 ,aaa ,0 ]
[1002 ,土建 ,bbb ,0 ]
[1003 ,电气一级节点 ,ccc ,1001 ]
[1004 ,电气一级节点二 ,ddd ,1001 ]
[1005 电气二级节点 eee 1003 ]
[1006 电气二级节点二 fff 1003 ]
[1007 土建一级节点 ggg 1002]

];
然后写一个js,for循环
for(a){
a[i][4]==0,
添加到0级,然后那个li加上一个class比如说 li class="m1001"
a[i][4]!=0,添加,添加到
m+a[i][4]这个li的ul下面。也给自己加上一个class="m1003"
添加完之后将a[i]从数组里面pop扔掉。

这样循环添加直到整个数组为空

0

你再用jquery的treeview,可以直接把整个ul li转换成可以伸缩展开的树。

0

在补充一下,如用这样的方式的话,你的ajax请求方式要改为同步请求,不能使用异步请求

0

哥们,我做了一个例子,就是你这种方式的,用的是DTREE,我把地址发给你,你看看,我做的例子是AJAX做的树形目录管理,表设计和你这个是一样的
http://leonelwong.iteye.com/admin/blogs/323073

0

采用js tree 看看,

0
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!