struts2+Jquery+json+treeview 动态加载树菜单

最新推荐文章于 2021-04-04 03:02:28 发布

zgphacker2010

最新推荐文章于 2021-04-04 03:02:28 发布

阅读量127

点赞数

分类专栏： Java Web 综合文章标签： jQuery json CSS JavaScript IE ViewUI

本文链接：https://blog.csdn.net/zgphacker2010/article/details/83871575

版权

Java Web 综合专栏收录该内容

27 篇文章 0 订阅

订阅专栏

哎最近公司项目里需要做组织架构功能,需要用jquery来生成树形菜单，在网上找了四五天,同事说jquery有treeview控件，于是,我在网上找啊找啊，找了好多，发现很多都不完整，弄得我花了好多时间，之前没深入接触过Jquery，所以不是很懂。弄了四五天，找来找去,还是那些，哎。同事说这个不难,我对自己也感到很自信。不过花了这么多天都没有一点结果,感觉好郁闷啊。突然，就在今天，那个动态树形菜单被弄出来了。呵呵，有点高兴哦！！！

我的页面时ftl的不过没关系。一样用。

页面代码如下：（记得页面需要导入js文件【jquery.cookie.js,jquery.treeview.async.js,jquery.treeview.js,jquery.treeview.edit.js】）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>系统部门列表 - Powered By ${systemConfig.systemName}</title>
<meta name="Author" content="SHOP++ Team" />
<meta name="Copyright" content="SHOP++" />
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<#include "/WEB-INF/template/common/include.ftl">
<link href="${base}/template/admin/css/list.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="${base}/css/tree/jquery.treeview.css" type="text/css" />
<link rel="stylesheet" href="${base}/css/tree/screen.css" type="text/css"/>
<script type="text/javascript" src="${base}/template/admin/js/list.js"></script>
</head>
<body class="ie">
    <frameset cols="50%,*" frameborder="1">
     <frame src="" name="leftMenu">
      <div id="tree" style="font-size:16px;">
      </div>
  </frame>
  <frame src="" name="rightMenu">
  </frame>
</frameset>

</body>
<script language="JavaScript">
    $(document).ready(function(){
          $("#tree").treeview({
                  collapsed: true,
      animated: "medium",
                  url: "sys_department!treeList.action"
         });
    });
</script>
</html>

好了利用jquery的方法调用后台方法后就去action类：

/**
* 构造树形菜单
*
*/

public String treeList(){
  try {
   getResponse().getWriter().print(generateJTVJsonString());
  } catch (IOException e) {
   // TODO Auto-generated catch block
   e.printStackTrace();
  }
  return null;
}

/**
* 产生jquery.treeview的jsonstring
*/
public String generateJTVJsonString() {

  System.out.println("generateJTVJsonString start .....");
     String id = getRequest().getParameter("root");
     System.out.println("id:"+id);
     String output = "";
     if (id == null) {
        return "";
     } else if (id.equalsIgnoreCase("source")) {
       output = generateInitTreeString();
        } else {
      output = generateTreeChildNodeString(id);
  }
     System.out.println("generateJTVJsonString end,return:"+output);
       return output;
}

/**
    * 产生子节点jsonstring
**/
   private String generateTreeChildNodeString(String departmentId) {
       StringBuilder jsonString = new StringBuilder();
       jsonString.append("[");
       List<SysDepartment> rootlist =sysDepartmentService.getDepartmentRootsById(departmentId);
       if (rootlist.isEmpty())
            return "";
       int i = 0;
       for (SysDepartment sysDepartment : rootlist) {
           if (i > 0) {
              jsonString.append(",");
           }
           jsonString.append(toJSONString(sysDepartment));
           i++;
       }
        jsonString.append("]");
        return jsonString.toString();
     }

   private String generateInitTreeString() {

    StringBuilder jsonString = new StringBuilder();
    jsonString.append("[");
    List<SysDepartment> rootlist = getAllSysDepartments();
    int i = 0;
    for (SysDepartment sysDepartment : rootlist) {
       if (i > 0) {
          jsonString.append(",");
    }
          jsonString.append(toJSONString(sysDepartment));
          i++;
    }
        jsonString.append("]");
        return jsonString.toString();
    }

//   /**
//    * 将对象转换成String
//    * @param sysDepartment
//    * @return
//    */
   private String toJSONString(SysDepartment sysDepartment) {
      StringBuilder sb = new StringBuilder();
      sb.append(" {");
   sb.append(" \"text\": \"" + generateLinkString(sysDepartment) + "\"");
   if (sysDepartmentService.getDepartmentRootsById(sysDepartment.getDepartmentId()).size()>0) {
   sb.append(", \"id\":\"" + sysDepartment.getDepartmentId() + "\"");
             sb.append(", \"hasChildren\":true");
   }
      sb.append(" }");
      return sb.toString();
    }

   /**
    * 设置超链接
    * @param category
    * @return
    */
   private String generateLinkString(SysDepartment sysDepartment) {
      String link = "<a href='sys_department!dedaoDepartmentById.action?id="+sysDepartment.getDepartmentId()+"' target='parent.rightMenu' >" + sysDepartment.getDepartmentName() + "</a>";
       //link = category.getCatName();
      return link;
      }

还有需要样式以及存放js文件的文件夹：我打包了(注：压缩包里的文件夹放到webRoot下，js，css等都可以在文件夹里找到)

zgphacker2010

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
struts2+Jquery+json+treeview 动态加载树菜单

哎最近公司项目里需要做组织架构功能,需要用jquery来生成树形菜单，在网上找了四五天,同事说jquery有treeview控件，于是,我在网上找啊找啊，找了好多，发现很多都不完整，弄得我花了好多时间，之前没深入接触过Jquery，所以不是很懂。弄了四五天，找来找去,还是那些，哎。同事说这个不难,我对自己也感到很自信。不过花了这么多天都没有一点结果,感觉好郁闷啊。突然，就在今天，那个动态树形菜...
复制链接

扫一扫