码迷,mamicode.com
首页 > Web开发 > 详细

【JSTREE】动态加载子节点

时间:2016-12-29 22:56:29      阅读:549      评论:0      收藏:0      [点我收藏+]

标签:hid   code   and   class   http   定义   out   .net   query   

js中初始化jstree

技术分享
$(‘#contact-org‘).jstree({  
                    "data" : {  
                        "dataType": ‘json‘,  
                        "url":function(node){  
                            return ctxPath + "/v-contact?queryOrg";  
                        },  
                        "data":function(node){  
                            return {"id" : node.id};  
                        }  
                    }  
                }  
}  
View Code

返回的json数据,对应用于树节点的数据结构

技术分享
 {    
    "attr" : {"id":"标示 "},  
    "data" :{"title": " 显示的标题 "  
           ,"attr":{"href" :"可以自定义一些值,在UI 解析"  
                           ,"class": "jstree-search"//可以预先在后台给节点设置样式  
                }  
              ,"icon":" 图标的地址  "  
             },   
      "state" : "closed" 或"open",  
          "children":[{子节点1},{子节点2}]  
}  
View Code

实现子节点动态加载的关键所在:

返回的数据中将children设置成布尔型true或者false。

当设置成true时,点击该树节点,jstree就会进行一次请求,请求的url和data配置就是初始化jstree中的那些。

当设置成false时,jstree就将该节点当成叶子节点

 

这样子就实现了jstree的动态加载子节点的功能。

【JSTREE】动态加载子节点

标签:hid   code   and   class   http   定义   out   .net   query   

原文地址:http://www.cnblogs.com/flydkPocketMagic/p/6234817.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!