关于java 展示树形菜单Tree的一些备忘信息。[bootstrap tree]

最近在项目中,需要迭代,显示树形菜单,这里我们使用的是bootstracp,所以使用的是bootstracp多级列表树,

使用的时候,非常简单,只需

<!-- Required Stylesheets -->

<link href="./css/bootstrap.css" rel="stylesheet">

<!-- Required Javascript -->

<script src="./js/jquery.js"></script>

<script src="./js/bootstrap-treeview.js"></script>

按照 实例,就可以在页面展示出tree了。

******************我要说的当然不是这个***************************************************

这里,我想说的是,后台的一些技巧。

数据库中,在我们考虑tree的时候,一般都是ID,和parentID。

以 分类树 为例, 直接上代码:

<select id="loadChild" resultMap="categoryResult">
    select * FROM P_CATEGORY WHERE  PARENTID = #id#
</select>
/**
     * 将类别转换为json数据对象;
     * 这里可以直接返回,SpringMVC支持返回json数据;
     * 这里使用BTree 和Gson,简化返回的参数.
     */
    @Override
    public String dealListToJson(Category cg) {
        cg = childNode( cg);
        BTree bt = new BTree();
        bt =    covertToTree(bt,cg);
        Gson gson =new Gson();
        return gson.toJson(bt);
    }

/**
     * 迭代获取每一级的 子节点,填充完整;
     * @param cg
     * @return
     */
    private Category childNode(Category cg) {
        cg = listChildNode(cg);
        if (cg.getCategoryList().size() > 0) {
            for (Category cgTemp : cg.getCategoryList()) {
                childNode(cgTemp);
            }
        }
        return cg;
    }

private BTree covertToTree(BTree bt,Category cg ){
        bt.setText(cg.getName());
        bt.setId(cg.getId());
        List<BTree> btList = new ArrayList<BTree>();
        if (cg.getCategoryList().size() > 0) {
            for(Category cgTemp : cg.getCategoryList()){
                BTree btTemp = new  BTree();
                btTemp=covertToTree(btTemp,cgTemp);
                btList.add(btTemp);
            }
        }
        bt.setNodes(btList);
        return bt;
    }

/**
     * 获取当前类别的下一级 子节点,【只是获取下一级】
     * @param cg
     * @return
     */
    public Category listChildNode(Category cg) {
        cg.setCategoryList(getSqlMapClientTemplate().queryForList("Category.loadChild",cg));
        return cg;
    }

迭代的时候,每次都去请求 数据库了,这里可以用缓存。。暂时没还添加。[其实是我们的节点不多]

这里使用Gson转换List,其实和其他的一样,

使用自定义的BTree,这个可以减少一些不必要的属性加到Tree 的 JSON字符串中。

。。

最终返回的数据格式:

{"text":"图书分类","id":1,"nodes":[{"text":"纺织专业图书","id":9,"nodes":[{"text":"纺织手工图书","id":11,"nodes":[]},{"text":"纺织加工图书","id":12,"nodes":[]}]},{"text":"纺织机械图书","id":10,"nodes":[]}]}

就是这样了,

有一点:

    var tree = [${gsonCol}];
    $(function(){
        //初始化树
        $(‘#tree‘).treeview({
                data: tree
        });
       //节点被选中
       $(‘#tree‘).on(‘nodeSelected‘, function(event, data) {
            $("#hidClo_parent").val(data.id);
       });

        $(‘#tree_main‘).treeview({
            data: tree
        });

在初始化的时候,var tree=[${gsonCol}],这里要使用[],不然显示不出树来。

时间: 2024-11-10 17:43:21

关于java 展示树形菜单Tree的一些备忘信息。[bootstrap tree]的相关文章

Java构建树形菜单

构建树形菜单 效果图:支持多级菜单. 菜单实体类: public class Menu { // 菜单id private String id; // 菜单名称 private String name; // 父菜单id private String parentId; // 菜单url private String url; // 菜单图标 private String icon; // 菜单顺序 private int order; // 子菜单 private List<Menu> ch

使用ztree展示树形菜单结构

官网:http://www.treejs.cn/v3/main.php#_zTreeInfo 一.功能简介 在权限系统中,实现给角色指定菜单权限的功能.主要包括以下几点: 读取全部菜单项,并以树形结构展现: 勾选角色拥有的菜单权限,保存入库: 重新编辑角色权限时,默认选中角色已有的菜单权限. 二.界面 三.实现过程 1.在服务端获取全部菜单资源,并转换为json字符串. @RequestMapping("/edit") public String edit(Integer roleId

最靠谱的java递归树形菜单显示

今天写权限整好涉及到一些菜单的显示,最先想到的是递归遍历输出,但是呢在网上找了很多有关的资料没有符合自己需求的所以就自己写了一个,如果觉得靠谱 请点点关注!!!赞一个 首先看一些设计的数据库设计 菜单的id menuId 菜单的名称 menuName 菜单的地址 url 菜单的父级别 parent 菜单的编码 menuCode 比较简单的设计: 闲话不多说直接上代码 实体类 如下: 此处省略 GET ()SET()方法 注意: 这里多了个 childrs集合 因为我们要进行递归遍历 把每个菜单的

使用zTree插件构建树形菜单

zTree下载:https://github.com/zTree/zTree_v3 目录: 就我看来,zTree较为实用的有以下几点: zTree 是一个依靠 jQuery 实现的多功能 “树插件”.优异的性能.灵活的配置.多种功能的组合是 zTree 最大优点. 支持 JSON 数据 支持静态 和 Ajax 异步加载节点数据 支持任意更换皮肤 / 自定义图标 支持极其灵活的 checkbox 或 radio 选择功能 提供多种事件响应回调 灵活的编辑(增/删/改/查)功能,可随意拖拽节点,还可

ExtJs Treepanel刷新树形菜单

在之前的一次项目开发学习过程中,我需要实现一个功能,就是点击导航栏的链接后左侧树形菜单自动生成对应的菜单项.当时这个问题困扰了我很长一段时间. 后来,在看了ExtJs官方的文档及Demo后一下恍然大悟. 我们来认真分析一下要实现这个功能就是让树形菜单整个刷新. 首先来看看官方的Demo里面是怎么写的: 后台Default.aspx.cs文件中的关键代码:    [DirectMethod]     public string RefreshMenu()     {         Ext.Net

实用的树形菜单控件tree

 jQuery plugin: Treeview 这个插件能够把无序列表转换成可展开与收缩的Tree. jQuery plugin: Treeview  jQuery  jstree jsTree是一个基于jQuery的Tree控件.支持XML,JSON,Html三种数据源.提供创建,重命名,移动,删除,拖\放节点操作.可以自己自定义创建,删除,嵌套,重命名,选择节点的规则.在这些操作上可以添加多种监听事件.  jstree  jQuery UI Widgets  FileTreePanel F

WEB开发中前后台树形菜单的展示设计

在WEB开发中经常需要进行树形菜单的展示,本例通过不同角度的总结了如下三种实现方式: 通过JS的递归实现前端菜单DOM的动态创建 通过JSP的include指令结合JSTL表达式语言递归实现菜单的展示 通过扩展JSP的标签在后端实现菜单的DOM节点并响应给前端展示 针对第一种方法,可以采用JS的相关组件,或者使用JS的递归调用将服务端相应的数据组装成DOM节点内容,动态添加到菜单的Container中,网上的例子较多,在此不再赘述,本例就后两种方案进行讲解. 通过JSP的include指令结合J

jquery,tree无限级树形菜单+简单实用案例

jquery,tree无限级树形菜单+简单实用案例 我在项目中用到产品类别的树形.各种地方都要用. 我就封装起来,方便以后调用. 记录下来,希望给新手们提供帮助.要记得导入jquery.js  tree.js 哦 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <%@ taglib prefix="c" uri=&quo

一个修改版的PHP ajax Tree树形菜单

国外的一个版本,发现有些错误,这两天修正了一下.PHP ajax Tree树形菜单,在PHP中快速实现一个目录列表类型的树形菜单,十分简洁漂亮,在PHP中应用广泛,本菜单基于Javascript和 XML技术实现.欢迎二次开发完善. 演示地址:http://www.codesc.net/other/php-tree-static/folder-tree-static.html相关网址:源码素材网 下载地址:http://www.codesc.net/other/php-tree-static.r