EasyUI實現非同步載入Tree
阿新 • • 發佈:2019-01-02
Html內容:
<fieldset style="height: 350px;">
<ul id="taskTree" style="height:400px;width:250px;overflow: auto;"></ul>
</fieldset>
js內容:
$('#taskTree').tree({ checkbox: false, url: url, animate:true, lines:true, onClick:function(node){ alert(node.text); }, onBeforeExpand:function(node,param){ $('#taskTree').tree('options').url = ctx + "/rims/rescue/loadRescueTaskTreeRootNodes.do?parentId="+node.id; } });
後臺內容:
JsonArray tree = new JsonArray(); JsonArray childs = new JsonArray(); for(DisaRescueTaskView tView:tasks){ JsonObject node = new JsonObject(); node.addProperty("id", tView.getId()); node.addProperty("text", tView.getName()); node.addProperty("state", "closed"); node.addProperty("icon", getTreeIconByRescueTaskMsg(tView)); childs.add(node); } JsonObject root = new JsonObject(); root.addProperty("id", "root"); root.addProperty("text", "救援任務"); root.addProperty("icon", "icon-ok"); root.add("children", childs); tree.add(root);
this.printOut(tree.toString());
注:當前節點的state屬性設定成:closed,則展開該節點時,會非同步展開這個節點下的所有子節點。