jstree 实现动态加载树子节点

1546年前javaScript10393


Js引用:

<script src="${root!}/resource/js/plugins/jsTree/jstree.min.js"></script>

html容器:

<div id="treeview" ></div>

js实现动态加载树:

//根据类型,点击节点自动触发一次url。
var url = "${root!}/admin/house/room/tree?lazy";
    $(function() {
          $("#treeview").jstree({
            'core' : {
              'data' : {
                  "url" : function(node) {
                      if(node.original) {
                        console.log(node.original);
                          var result = url;
                          result += "&type=" + node.original.type;
                            console.log(node.original.buildingValue);
                          if(node.original.buildingValue!=undefined) {
                               result += "&buildingValue=" + node.original.buildingValue;
                          }
                          if(node.original.floorValue!=undefined) {
                               result += "&floorValue=" + node.original.floorValue;
                          }
                           if(node.original.roomValue!=undefined) {
                               result += "&roomValue=" + node.original.roomValue;
                          }
                          return result;
                      } else {
                          return url;
                      }
                  },
                  "data" : function (node) {
                    return { "id" : node.id };
                  }
               }
             }
          });
    });

//点击节点可获取的值i

$('#treeview').on("changed.jstree", function (e, data) {  
    console.log("The selected nodes are:"+data.node);  
    console.log(data.node.id);
                 //选择的node id  
    console.log(data.node.text);            //选择的node text  
               var inst = data.instance;  
                var selectedNode = inst.get_node(data.selected);  
   console.log(selectedNode); //可获取整个选择的节点对象值
    //type = selectedNode.original.type;

});

后台类:

public void tree() {
//        JSONObject json = new JSONObject();
        List jsonlist = new ArrayList();
        List list = new ArrayList();
        if("#".equals(getPara("id"))) {
            JSONObject json = new JSONObject();
            json.put("text", "养老机构");
            json.put("children", true);
            json.put("type", "building");
            renderJson(json);
        } else {
            String type = getPara("type");
            switch(type) {
            case "building":
                jsonlist = new ArrayList();
                 list = Db.find("select DISTINCT building text from house");
                for (int i=0;i<list.size();i++){
                   Record record = (Record) list.get(i);
                   JSONObject json = new JSONObject();
                   json.put("text", "楼号"+record.getStr("text"));
                   json.put("children", true);
                   json.put("type", "floor");
                   json.put("buildingValue",  record.getStr("text"));
                   jsonlist.add(json);
                }
                logger.info("jsonlist=="+JSON.toJSON(jsonlist) );
                renderJson(jsonlist);
                break;
            case "floor":
                jsonlist = new ArrayList();
                 list = Db.find(" select DISTINCT  floor text,building  " +
                         "from house where building='"+getPara("buildingValue")+"'  ");
                for (int i=0;i<list.size();i++){
                   Record record = (Record) list.get(i);
                   JSONObject json = new JSONObject();
                   json.put("text", "楼层"+record.getStr("text"));
                   json.put("children", true);
                   json.put("type", "room");
                   json.put("buildingValue", record.getStr("building"));
                   json.put("floorValue",  record.getStr("text"));
                   jsonlist.add(json);
                }
                logger.info("jsonlist=="+JSON.toJSON(jsonlist) );
                renderJson(jsonlist);
                break;
            case "room":
                jsonlist = new ArrayList();
                 list = Db.find(" select DISTINCT room text,floor,building  from house " +
                         " where floor='"+getPara("floorValue")+"' " +
                         " and  building='"+getPara("buildingValue")+"'     ");
                    for (int i=0;i<list.size();i++){
                       JSONObject json = new JSONObject();
                       Record record = (Record) list.get(i);
                       json.put("text", "房间"+record.getStr("text"));
                       json.put("children", true);
                       json.put("type", "bed");
                       json.put("buildingValue", record.getStr("building"));
                       json.put("floorValue",  record.getStr("floor"));
                       json.put("roomValue",  record.getStr("text"));
                       jsonlist.add(json);
                    }
                    renderJson(jsonlist);
                break;
            case "bed":
                jsonlist = new ArrayList();
                 list = Db.find(" select DISTINCT bed text,room ,floor,building from house" +
                         " where room = '"+getPara("roomValue")+"' and " +
                         " floor='"+getPara("floorValue")+"' and  building='"+getPara("buildingValue")+"'  ");
                        for (int i=0;i<list.size();i++){
                           Record record = (Record) list.get(i);
                           JSONObject json = new JSONObject();
                           json.put("text", "床位"+record.getStr("text"));
                           json.put("type", "last");
                           json.put("children", false);
                           json.put("buildingValue", record.getStr("building"));
                           json.put("floorValue",  record.getStr("floor"));
                           json.put("roomValue",  record.getStr("room"));
                           json.put("bedValue",  record.getStr("text"));
                           jsonlist.add(json);
                        }
                 renderJson(jsonlist);
                break;
            }
        }
        
    }



标签: JqueryIT

相关文章

jquery.PrintArea.min.js实现打印实例

jquery.PrintArea.min.js实现打印实例

 jquery实现的打印功能大致跟浏览器自带的 Ctrl+P的 效果一样 一、效果图:全屏打印:局部打印:二、代码<html>   <head>...

jquery 获取焦点

当文本框或下拉等必填时,如果没有输入就给予提示并使该文本框获得焦点!如果是js,对象.focus()即可。可是如果是jQuery, 这样$("#aa") 返回的就不是DOM对象而是...

js/Jquery判断变量是否含有汉字

  js判断变量是否含有汉字 ,直接附上代码:   var aa= '你好';    var...

jquery 操作html元素(及CSS)

jquery 操作html元素(及CSS)

 $("li").addClass("aui-user-view-cell aui-img") ;  //给元素添加样式$('#a1...

jquery实现飘窗(飘动图片) 插件bay-window.js

jquery实现飘窗(飘动图片) 插件bay-window.js

效果:   1.js及css部分:    <script type="text/javascript" src="/js/j...

JS或Jquery获取浏览器URL的参数值 汉字值乱码 并转码

JS或Jquery获取浏览器URL的参数值 汉字值乱码 并转码

1、获取url很简单,代码如下:     window.location.href;2、jquery获取url参数比较复杂,要用到正则表达式,所以学好javascript正则式多么...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。