jQuery通讯录树形节点

所属分类:导航,输入-文件树,选择框

 12686  73  查看评论 (27)
jQuery通讯录树形节点 ie兼容10

数据结构如下:

var obj = {
    "childList": [
        {
            "id": 2,
            "name": "行政部门",
            "parentId": 1,
            "parentIds": "0,1,",
            "childList": [
                {
                    "childList": [],
                    "id": 4,
                    "name": "校长室",
                    "parentId": 2,
                    "parentIds": "0,1,2,",
                    "userList": [
                    {
                    "id": 111,
                   "realName": "杨武1",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               }
                    ]
                },
                {
                    "childList": [],
                    "id": 5,
                    "name": "德育处",
                    "parentId": 2,
                    "parentIds": "0,1,2,",
                    "userList": [
                    {
                    "id": 111,
                   "realName": "杨武(test)2",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               },
               {
               "id": 222,
                   "realName": "杨武(test)3",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               }
                    ]
                }
            ],
            "userList": [
                {
                "id": 333,
                    "realName": "杨武s",
                    "userName": "admin",
                    "uuid": "uuidtest1"
                },
                {
                "id": 444,
                    "realName": "杨武(test)s",
                    "userName": "yang",
                    "uuid": "uuidtest2"
                }
            ]
        },
   {
            "id": 3,
            "name": "学科组",
            "parentId": 1,
            "parentIds": "0,1,",
            "childList": [
                {
                    "id": 6,
                    "name": "文科组",
                    "parentId": 3,
                    "parentIds": "0,1,3,",
                    "childList": [
                    {
                   "id": 6,
                   "name": "语文组",
                   "parentId": 3,
                   "parentIds": "0,1,3,",
                   "childList": [
                   
                   ],
                   "userList": [
                   {
                   "id": 555,
                   "realName": "杨武语文",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               }
                   ]
               },
               {
                   "id": 6,
                   "name": "英语组",
                   "parentId": 3,
                   "parentIds": "0,1,3,",
                   "childList": [],
                   "userList": [
                   {
                   "id": 444,
                   "realName": "杨武英语",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               },
               {
               "id": 777,
                   "realName": "杨武(test)",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               }
                   ]
               }
                    ],
                    "userList": [
                    {
                    "id": 888,
                   "realName": "杨武",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               },
               {
               "id": 999,
                   "realName": "杨武(test)",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               }
                    ]
                },
                {
                    "id": 6,
                    "name": "理科组",
                    "parentId": 3,
                    "parentIds": "0,1,3,",
                    "childList": [],
                    "userList": [
                    {
                    "id": 1010,
                   "realName": "杨武",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               },
               {
               "id": 1111,
                   "realName": "杨武(test)",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               }
                    ]
                }
       ],
            "userList": [
            {
            "id": 1212,
                    "realName": "杨武(test)",
                    "userName": "yang",
                    "uuid": "uuidtest2"
                }
            ]
        }
    ],
    "id": 1,
    "name": "天心岛小学部门",
    "parentId": 0,
    "parentIds": "0,",
    "userList": [
        {
        "id": 1313,
            "realName": "杨武",
            "userName": "admin",
            "uuid": "uuidtest1"
        }
    ]
}

1. 只需要根据树形结构数据就可以自动生成

相关插件-文件树,选择框

jquery树形菜单插件简单的分类树形菜单代码

jquery树形菜单插件简单的分类树形菜单代码,简单实用。
  文件树
 36565  48

bootstrap风格的zTree插件

使用bootstrap的同学,在使用zTree插件时,发现风格很难看,和bootstrap不搭调,现在你们的福利来了,bootstrap风格的zTree插件发布了!
  文件树
 12907  108

jQuery树型插件dtree(带搜索)

dtree选择部门或者选择部门下人员复选框单选框插件
  文件树
 11507  51

jquery.treeview.js树控件

jquery.treeview.js树控件
  文件树
 91297  54

讨论这个项目(27)回答他人问题或分享插件使用方法奖励jQ币

    唛~蔸 0
    2017/11/10 16:53:00

    感觉还不错啊,一定端的

    回复
    YanYu 0
    2017/10/31 17:23:10
    Antony 0
    2017/10/30 17:37:36

    为什么搜索不能用,全选也不能用

    回复
    ^O^^_^ 0
    2017/10/25 14:27:26
    〃Lhnm╂ 0
    2017/10/18 9:42:59

    选择人员后 在已选人员下 名字对不上啊?

        挂念 -h/x30
        2017/10/26 14:56:50

        自己改改

    回复
    铁血总督 0
    2017/10/4 22:46:21

    看起来还挺不错的。点了一下!

    回复
    小烦恼SJ 0
    2017/9/29 10:26:43

    后台传递过来的json串需要遍历直接放到childList里面吗

    回复
    no ifs 0
    2017/8/12 10:38:36

    good

        纯真IT-Kevin0
        2017/9/13 13:39:49
        挺好看的一个插件
    回复
    chase(PHP) 0
    2017/8/7 9:20:18
    Techape 0
    2017/8/3 21:52:10

    版主,这个插件可以集于api接口的json数据初始化树形结构吗?

    回复
取消回复