easyui菜单树显示
目前做了一个easyui项目需要显示多级菜单,菜单配置到数据库中,因此每级菜单都需要到数据库中取。
easyui的菜单树使用:easyui-tree,挺好用,格式是:
<ul id="tt" class="easyui-tree">
<li>
<span>Folder</span>
<ul>
<li>
<span>Sub Folder 1</span>
<ul>
<li>
<span><a href="#">File 11</a></span>
</li>
<li>
<span>File 12</span>
</li>
<li>
<span>File 13</span>
</li>
</ul>
</li>
<li>
<span>File 2</span>
</li>
<li>
<span>File 3</span>
</li>
</ul>
</li>
<li>
<span>File21</span>
</li>
</ul>
显示效果为:
我的项目中菜单列表必须在后台取出所有菜单,然后组织成固有样式的json串返回给前台:
json串样式:var _menus = {"basic":[{"icon":"icon-sys","menuid":"1","menuname":"根菜单1",
"menus":[{"icon":"icon-nav","menuid":"101","menuname":"二级菜单1","url":"./login.do"},
{"icon":"icon-nav","menuid":"102","menuname":"二级菜单2",
"menus":[{"icon":"icon-nav","menuid":"10201","menuname":"三级菜单21","url":"./login.do"},
{"icon":"icon-sys","menuid":"10202","menuname":"三级菜单22",
"menus":[{"icon":"icon-nav","menuid":"10203","menuname":"四级菜 单221","url":"./login.do"}]
}]},
{"icon":"icon-nav","menuid":"103","menuname":"二级菜单3","url":"../demo/demo1.jsp"},
{"icon":"icon-nav","menuid":"104","menuname":"二级菜单4","url":"fsdfsdf"}]
}]};
这算是比较麻烦的多级菜单了,因此我第一次在后台拼这个json串时使用了笨方法,直接一级一级菜单取出然后拼到一起。当实现之后,被我同事发现给我提供了一个更好的方案,那就是后台使用菜单对象的方案。听了之后恍然大悟,果断返工。
实现方式如下:
javabean类:
public class MenuTreeNode implements Comparable<MenuTreeNode>{
private String menuid;
private String url;
private String menuname;
public String getMenuid() {
return menuid;
}
public void setMenuid(String menuid) {
this.menuid = menuid;
}
public String getUrl() {
return url;
}
public void setUrl(String url) {
this.url = url;
}
public String getMenuname() {
return menuname;
}
public void setMenuname(String menuname) {
this.menuname = menuname;
}
private String icon;
public String getIcon() {
return icon;
}
public void setIcon(String icon) {
this.icon = icon;
}
private List<MenuTreeNode> menus;
public List<MenuTreeNode> getMenus() {
return menus;
}
public void setMenus(List<MenuTreeNode> nodeList) {
this.menus = nodeList;
}
public int compareTo(MenuTreeNode o) {
// TODO Auto-generated method stub
return 0;
}
拼接json串方法:
public JSONObject getAllMunus() {
MenuTreeNode rtnNode = null;
HashMap<String,MenuTreeNode> hmMenuTreeNode = new HashMap<String,MenuTreeNode>();
try {
ArrayList<Menu> ldmenuList = (ArrayList<Menu>) ResourceHelper.findMenu();
for (int i = 0; i < ldmenuList.size(); i++) {
MenuTreeNode menuTreeNode = new MenuTreeNode();
Menu selMenuNode = ldmenuList.get(i);
String nodecode = selMenuNode.getMenuId();
String parentnodecode = selMenuNode.getParentMenuId();
if("999999".equals(parentnodecode)){
// 根结点
rtnNode = menuTreeNode;
}
String url = selMenuNode.getUrl();
menuTreeNode.setMenuid(nodecode);
menuTreeNode.setMenuname(selMenuNode.getMenuName());
menuTreeNode.setIcon(selMenuNode.getIcon());
if(!"".equals(url)|| url!=null){
menuTreeNode.setUrl(url);
}else{
menuTreeNode.setUrl("1111");
}
List<MenuTreeNode> nodeList = new ArrayList<MenuTreeNode>();
menuTreeNode.setMenus(nodeList);
// CHILDFLAG 子节点个数
// int childflag = getTreeNodeChildCount(selMenuNode.getChildflag());
// if(childflag>0){
// 文件夹节点
hmMenuTreeNode.put(nodecode, menuTreeNode);
// }
if("999999".equals(parentnodecode)){
// 根结点
rtnNode = menuTreeNode;
continue;
}
// 将当前节点添加到父节点
if(hmMenuTreeNode.containsKey(parentnodecode)){
MenuTreeNode PNode = hmMenuTreeNode.get(parentnodecode);
nodeList = PNode.getMenus();
nodeList.add(menuTreeNode);
// 排序
//Collections.sort(nodeList);
} else {
// 异常节点信息
System.out.println("当前菜单异常:" + nodecode);
}
}
} catch (Exception e) {
e.printStackTrace();
}
List<MenuTreeNode> node = rtnNode.getMenus();
String ss = JSonUtils.toJSon(node);
JSONObject jsonObject = new JSONObject();
JSONArray jsonArray2;
try {
jsonArray2 = new JSONArray(ss);
System.out.println(jsonArray2.toString());
try {
jsonObject.put("basic", jsonArray2);
} catch (JSONException e) {
e.printStackTrace();
}
} catch (JSONException e1) {
// TODO Auto-generated catch block
e1.printStackTrace();
}
System.out.println(jsonObject);
return jsonObject;
}
这样返回的json就完全符合前台要求的格式了,是不是简单的多。
然后在前台解析这个json串,拼接easyui-tree时还是要细心。
水平有限,多多指教!
浙公网安备 33010602011771号