jstree 实现动态加载树子节点
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;
}
}
}
本文原创,转载必追究版权。