相信很多人都在为无法默认选中树节点而苦恼,弄出来了特意分享出来
public Object Menu(String roleId, HttpServletRequest req) {
List<SysMenu> list = menuService.query(Cnd.orderBy().asc("location").asc("path"));
List<SysMenu> datas = roleService.getDatas();
List<NutMap> menus = new ArrayList<>();
List<SysMenu> roleMenus = roleService.getMenusAndButtons(roleId);//当前角色的权限
for (SysMenu menu : list) {
NutMap map = new NutMap();
for (SysMenu bt : datas) {
if (menu.getPath().equals(bt.getPath().substring(0, bt.getPath().length() - 4))) {
menu.setHasChildren(true);
break;
}
}
for(SysMenu rm:roleMenus){
if (menu.getId().equals(rm.getId())){
map.put("state", new State(false,false,true));//是否允许编辑-是否展开-是否选中树节点
break;
}
}
map.put("id", menu.getId());
map.put("text", menu.getName());
map.put("icon", Strings.sBlank(menu.getIcon()));
map.put("parent", "".equals(Strings.sNull(menu.getParentId())) ? "#" : menu.getParentId());
map.put("data", menu.getHref());
menus.add(map);
}
req.setAttribute("menus", Json.toJson(menus));
return Strings.isBlank(roleId) ? null : roleService.fetch(roleId);
}
public class State { private boolean disabled; private boolean opened; private boolean selected; /** * 树节点勾选 * @param disabled 编辑 * @param opened 是否展开 * @param selected 是否选中 */ public State(boolean disabled,boolean opened,boolean selected){ this.disabled=disabled; this.opened=opened; this.selected=selected; } public boolean isDisabled() { return disabled; } public void setDisabled(boolean disabled) { this.disabled = disabled; } public boolean isOpened() { return opened; } public void setOpened(boolean opened) { this.opened = opened; } public boolean isSelected() { return selected; } public void setSelected(boolean selected) { this.selected = selected; } }
<header class="header navbar bg-white shadow"> </header> <div class="content-wrap"> <div class="wrapper"> <div class="row mb15"> <div class="col-lg-12"> <form id="addRoleForm" class="form-horizontal stepy" method="post" action="url"> <input type="hidden" id="menuIds" name="menuIds"/> <div class="form-group no-b"> <div class="col-sm-8"> <div class="panel"> <div class="panel-heading no-b"> <h5>选择<b>菜单</b></h5> </div> <div class="panel-body"> <div id="jsTreeMenu"></div> </div> </div> </div> <div class="col-sm-4"> <div class="panel"> <div class="panel-heading no-b"> <h5>菜单<b>描述</b></h5> </div> <div id="menuDescript" class="panel-body"> <div class='alert alert-info'>请勾选每一个需要分配的菜单</div> </div> </div> </div> </div> </form> </div> </div> </div> </div> <script language="JavaScript"> var jsTreeMenu; $(function () { jsTreeMenu = $("#jsTreeMenu").jstree({ plugins: ["wholerow", "checkbox"], core: { data: ${menus!} }, checkbox: { three_state: false, cascade: 'down' } }).on("hover_node.jstree", function (e, data) { if (data.node.data) $("#menuDescript").text(data.node.data); }).on("dehover_node.jstree", function (e, data) { $("#menuDescript").html("<div class='alert alert-info'>请勾选每一个需要分配的菜单</div>");//清空菜单描述 }).bind("loaded.jstree", function (e, data) { //立即加载树下所有节点 }); }); function each(node, tree, nodes) { var p = tree.get_parent(node); if (p.length > 1) { if (nodes&&p&&nodes.indexOf(p)<0) nodes.push(p); each(p, tree, nodes); } } function complete() { var tree = $.jstree.reference("#jsTreeMenu"); var ids = tree.get_selected(); //查询所选节点的所有父节点 for (var i = 0; i < ids.length; i++) { var node = ids[i]; each(node, tree, ids); } if (ids.length > 0) { $.post("url", {menuIds: ids.toString(), roleid: '${obj.id}'}, function (data) { if (data.code == 0) { Toast.success(data.msg); setTimeout(function () { $("#goback").trigger("click"); }, 1000); } else { Toast.error(data.msg); } }, "json"); } else { Toast.warning("请先选择菜单!"); } } </script> <%}%>
相关推荐
//JS实现treeview中选中父节点,子节点也选中,如果子节点全部选中,自动选中父节点 //仅支持TreeView //调用方法 TreeView.Attributes.Add("onclick", "OnTreeNodeChecked()");
JS Tree树形菜单,确实是够经典的WEB版树形菜单特效,带有节点连接线的树状折叠菜单,点击的时候会展开子菜单,适合用于WEB版的信息管理系统、CMS后台系统中,你喜欢的话,你可以用在任意你想要的地方。
js树形菜单组件,主要解决大数据加载节点卡死问题。
NULL 博文链接:https://jsufly.iteye.com/blog/736119
例程可正常使用,非常的简单,基本上学过几天代码的人都能够正常使用。采用纯js编写,不复杂
jsTree中文api文档,js操作树可移动节点 增加修改删除节点.jsTree中文api文档,js操作树可移动节点 增加修改删除节点.
jstree创建无限分级树的方法【基于ajax动态创建子节点】.docx
jsTree是基于javascript的一个跨浏览器树控件,功能强大,既可以一次性把所有节点都加载到客户端,也可以只加载一层,点击节点后再去服务端获取下层节点。
有时候开发树形菜单权限管理,选择父节点不想子节点全部选中,经过我的修改现在可以做到。你可以试试。只需要覆盖项目 tree.js就可以。 layui2.5.4版本
jsTree实例,jsTree实例,jsTree实例
纯JavaScript+树形菜单,基于js的无限树形菜单(dtree),史上最完美最简单js树形菜单,AlaiJSCtr,jstree+JS树形菜单合集,js树形菜单,模仿CSDN树型菜单
jstree是一款非常实用的jQuery目录树插件。jsTree树插件易于扩展,可以配置主题,支持HTML和JSON格式的数据,还支持异步回调数据,支持多级树结构等。
十分漂亮的 js tree控件 同时也支持动态生成树,使用方便快捷。
jsTree操作 jsTree插件简介 Web开发使用jsTree实例
纯js的树形菜单(添加删除节点)动态添加父节点子节点。jquery实现
自己写的,花了一晚上。自己觉得还可以。主要是Tree.js文件。里面有一个例子,一看就会用。
本压缩包收集了10多个近年网上流行且深受好评的JS树形菜单,包括动态加载和静态加载的,ASP、PHP等运行环境的都有,每一个都带有实例,有的加入了AJAX技术,可以说非常实用,也值得收藏一下,树形菜单也算是比较常用...
jsTree大集合 jsTree大集合 jsTree大集合