在（一）中的框架基础上，在west的部分添加异步树：
<
ul
id
=
"menuTree"
class
=
"easyui-tree"
></
ul
>
然后配置其节点的数据加载：
<
script
>
$(
function
() {
//创建tab标签页
function
addTab(title, url, id) {
if
($(
'#tt'
).tabs(
'exists'
, title)) {
$(
'#tt'
).tabs(
'select'
, title);
}
else
{
var
content =
'<iframe scrolling="auto" frameborder="0" src="'
+ url +
'" style="width:100%;height:100%;"></iframe>'
;
$(
'#tt'
).tabs(
'add'
, {
title : title,
content : content,
closable :
true
});
}
};
$(
'#menuTree'
)
.tree(
{
url :
"${ctp}/treeInit"
,
//向后台传送id,获取根节点
lines :
true
,
/* iconCls : "${ctp}/common/pictures/database.gif", */
//节点点开前触发
onBeforeExpand :
function
(node) {
$(
'#menuTree'
).tree(
'options'
).url =
"${ctp}/treeControl?pid="
+ node.pid+
"&flag="
+node.flag+
"&url="
+node.url+
"&text="
+node.text;
},
//返回过滤过的数据进行展示，这里返回的数据作为点开节点的子节点
loadFilter :
function
(data) {
if
(data.msg) {
return
data.msg;
}
else
{
return
data;
}
},
onClick :
function
(node) {
//如果节点有url属性，则打开一个标签页
if
(node.url !=
null
) {
addTab(node.text, node.url, node.id);
}
}
});
});
</
script
>
其中loadFilter方法是用来加载树的节点，而addTab方法是用来添加tab标签页的。
[size=18.6667px]其中url配置的是树节点的查询语句，可自行设计，？后面的是传递的参数，也可根据需求进行删减。
[size=18.6667px]下面是我的controller里的对应方法：
- packagecom.kunlun.control;
- @Controller
- publicclass TreeControl {
@Autowired
privateTreeService treeService;
@RequestMapping(value ="/treeInit", produces = {"application/json;charset=UTF-8"})
@ResponseBody
public String findRoot(HttpServletRequest req, HttpServletResponse resp) {
returntreeService.findRoot();
}
@RequestMapping(value ="/treeControl", produces = {"application/json;charset=UTF-8"})
@ResponseBody
public String findAllNodes(HttpServletRequest req, HttpServletResponse resp) {
String id = req.getParameter("id");
intflag = Integer.valueOf(req.getParameter("flag")).intValue();
String url = req.getParameter("url");
String text=req.getParameter("text");
returntreeService.findAllNodes(flag,url,id,text);
}
}
service层的sql省略
更多免费技术资料可关注：annalin1203
