js 树菜单 ztree
/**
<div id="menuContent" class="menuContent" style=" position: absolute;">
<ul id="orgTree" class="ztree" style="margin-top:0; width:160px;"></ul>
</div>
*/
//var allowClick = true; //标记节点是否能被点击
var sdorg={};
/**
* 初始化组织机构树
* renderId 渲染位置
* nodeClick 点击时触发的事件
* beforeNodeClick 点击前触发的事件
* ischkbox 是否显示多选框
*/
sdorg.showcurrorg =function (renderId,nodeClick,beforNodeClick,ischkbox) {
var orgNodes;
var setting = {
data:{
simpleData:{
enable:true,
idKey:"id",
pIdKey:"parentId",
root:0
},
key:{
name:"orgName"
}
},
view:{
showIcon:true
},
check:{
enable:ischkbox
,chkStyle:'checkbox'
,chkboxType:{ "Y": "", "N": "" }
//,autoCheckTrigger: false
},
async:{
enable:true,
url:baseURL+"/org/org!listOrgNode.action",
autoParam:["id"],
dataFilter:ajaxDataFilter
},
callback:{
// onExpand:expandParentOrg,
onClick:nodeClick||_nodeClick,
beforeClick:beforNodeClick||_beforNodeClick,
}
};
var url =baseURL+'/org/org!listOrgRoot.action';
$.ajax({
url:url,
type:'post',
dataType:'json',
success:function (result) {
if ('0' == result.code) {
$.fn.zTree.init($('#'+renderId), setting, null);
var orgTree = $.fn.zTree.getZTreeObj(renderId);
orgTree.addNodes(null, result.data.orgList );
// 展开机构树的根节点
var rootNodes = orgTree.getNodes();
if (rootNodes.length > 0)
orgTree.expandNode(rootNodes[0], true, false, true);
//orgTree.expandAll(true);
} else {
alert(result.desc);
}
}
});
}
sdorg.showcurrorg1 =function (renderId,nodeClick,nodeCheck,ischkbox,beforeShow,onExpand,orgId,orgName) {
var orgNodes;
var setting = {
data:{
simpleData:{
enable:true,
idKey:"organizationId",
pIdKey:"parentId",
root:0
},
key:{
name:"organizationName"
}
},
view:{
showIcon:true
},
check:{
enable:ischkbox
,chkStyle:'checkbox'
,chkboxType: { "Y": "s", "N": "s" }
,autoCheckTrigger: true
},
async:{
enable:true,
url:baseURL+"/org/org!listOrgNode.action",
autoParam:["organizationId"],
dataFilter:ajaxDataFilter
},
callback:{
// onExpand:expandParentOrg,
onClick:nodeClick||_nodeClick,
onCheck:nodeCheck,
onExpand:onExpand
}
};
//var url = cur_user_id=="admin"?baseURL+'/orgext/orgext!listOrgRoot.action':baseURL+'/orgext/orgext!listOrgUnderCurrentUserOrg.action';
var url = orgId?baseURL+'/org/org!listOrgNode.action':baseURL+'/org/org!listOrgRoot.action';
// alert(orgId); return;
$.ajax({
url:url,
type:'post',
dataType:'json',
data:{organizationId:orgId},
success:function (result) {
if ('0' == result.code) {
$.fn.zTree.init($('#'+renderId), setting, null);
var orgTree = $.fn.zTree.getZTreeObj(renderId);
if(orgId){
var newNode = {organizationId:orgId,organizationName:orgName};
orgTree.addNodes(null, newNode);
orgTree.addNodes(orgTree.getNodeByParam("organizationId",orgId,null), result.data.orgList );
}else{
orgTree.addNodes(null, result.data.orgList );
}
// 展开机构树的根节点
var rootNodes = orgTree.getNodes();
if (rootNodes.length > 0)
orgTree.expandNode(rootNodes[0], true, false, true);
//orgTree.expandAll(true);
beforeShow&&beforeShow.call();
} else {
alert(result.desc);
}
}
});
}
sdorg.showchildorg= function (renderId,orgId,nodeClick,beforNodeClick,ischkbox,iscanexpand) {
var orgNodes;
var setting = {
data:{
simpleData:{
enable:true,
idKey:"organizationId",
pIdKey:"parentId",
root:0
},
key:{
name:"organizationName"
}
},
view:{
showIcon:true
},
check:{
enable:ischkbox
,chkStyle:'checkbox'
,chkboxType:{ "Y": "", "N": "" }
//,autoCheckTrigger: false
},
async:{
enable:iscanexpand||false,
url:baseURL+"/orgext/orgext!listOrgNode.action",
autoParam:["organizationId"],
dataFilter:ajaxDataFilter
},
callback:{
// onExpand:expandParentOrg,
onClick:nodeClick||_nodeClick,
beforeClick:beforNodeClick||_beforNodeClick,
}
};
var url = orgId?baseURL+'/orgext/orgext!listOrgNode.action':baseURL+'/orgext/orgext!listOrgRoot.action';
$.ajax({
url:url,
type:'post',
data:{organizationId:orgId},
dataType:'json',
success:function (result) {
if ('0' == result.code) {
orgNodes =ajaxDataFilter(null, null, result); //result.data.orgList;
if (orgNodes.length > 0) {
$.fn.zTree.init($('#'+renderId), setting, orgNodes);
// 展开机构树的根节点
var orgTree = $.fn.zTree.getZTreeObj(renderId);
var rootNodes = orgTree.getNodes();
if ((!orgId||iscanexpand)&&rootNodes.length > 0)
orgTree.expandNode(rootNodes[0], true, false, true);
//orgTree.expandAll(true);
}
} else {
alert(result.desc);
}
}
});
}
//
/**
* 异步加载节点数据后的处理函数
* @param treeId
* @param parent
* @param result
*/
function ajaxDataFilter(treeId, parent, result) {
//if ('0' == result.code) {
return result.data.orgList;
//}
}
function _nodeClick(event, treeId, treeNode) {
//console.info(treeNode);
//alert(treeNode.organizationId);
//alert(treeNode.organizationName);
}
/**
* 控制节点是否能被选中
* @param treeId
* @param treeNode
* @param clickFlag
*/
function _beforNodeClick(treeId, treeNode, clickFlag) {
}
//当前对应input框 显示的input 和要隐藏id的input
var $_currdom2,$_hiddendom2;
//显示下拉树
function showMenu2(inputid,hiddenid) {
$_currdom2 = $("#"+inputid);
$_hiddendom2 = $("#"+hiddenid);
var cityOffset = $_currdom2.offset();
$("#Content").css({left:cityOffset.left, top:cityOffset.top-50}).slideDown("fast");
$("body").bind("mousedown", onBodyDown2);
}
//隐藏下拉树
function hideMenu2() {
$("#Content").fadeOut("fast");
$("body").unbind("mousedown", onBodyDown2);
}
//点击页面其他位置时,下拉树退出
function onBodyDown2(event) {
if (!(event.target.id == "Btn" || event.target.id == "Content" || $(event.target).parents("#Content").length>0)) {
hideMenu2();
}
}
//节点点击事件
function onClick2(e, treeId, treeNode) {
$_currdom2.val(treeNode.organizationName);
$_currdom2.focus();
$_hiddendom2.val(treeNode.organizationId);
$("#Content").fadeOut("fast");
}
function onCheck(e,treeId,treeNode){
var treeObj = $.fn.zTree.getZTreeObj("org");
var $ckNode = treeObj.getCheckedNodes();
var orgName = "";
var orgId = "";
$($ckNode).each(function(){
orgName+=this.organizationName+",";
orgId+=this.organizationId+",";
})
$_currdom2.val(orgName);
$_hiddendom2.val(orgId);
}
<!-- 组织架构树 -->
<div id="Content" class="menuContent" style="position:absolute;display:none;z-index:10000;">
<ul id="org" class="ztree" style="margin-top:0; width:350px; background:white; border:2px dotted #cccccc;"></ul>
</div>
js 树菜单 ztree的更多相关文章
- vue.js 树菜单 递归组件树来实现
树形视图 Example: https://vuefe.cn/v2/examples/tree-view.html 参照前辈方法实现的,觉得不错,记录一下: 父组件: <!-- 菜单树 --&g ...
- js无限级树菜单
以前做网站,树形菜单一般都很简单,自己定义风格样式,简单的js控制,后来原来网上很多文章都在讨论Js树型菜单,看了几个实例,发现这个树比较简单好用. http://hovertree.com/texi ...
- JS树形菜单
超全的JS树形菜单源代码共享(有实例图) 树形菜单是很常用的效果,常用在管理软件当中,但是一套树形菜单已经不能满足需求,所以如果能有一套比较全面的树形菜单JS特效代码,将会非常方便,下面懒人萱将超全的 ...
- C#动态加载树菜单
在做权限系统的时候,需要有一个树形的菜单.下图就是一个树形菜单的样式 但问题是,我们可以实现写死的树形菜单.什么是写死的?就是在前台代码中写好要加载的树形菜单是什么样子的.但是我们权限系统的要求是动态 ...
- EasyUI 树菜单
EasyUI 树菜单 通过ssm框架项目实现EasyUI 的树菜单的单选,复选,异步加载树,同步加载树和树权限控制等功能. 本章知识点 效果图: 需求:通过SSM框架,实现EasyUI 树菜单的单选, ...
- 基于Bootstrap Ace模板+bootstrap.addtabs.js的菜单
这几天研究了基于bootstrap Ace模板+bootstra.addtabs.js实现菜单的效果 参考了这个人的博客 https://www.cnblogs.com/landeanfen/p/76 ...
- js矩阵菜单或3D立体预览图片效果
js矩阵菜单或3D立体预览图片效果 下载地址: http://files.cnblogs.com/elves/js%E7%9F%A9%E9%98%B5%E8%8F%9C%E5%8D%95%E6%88% ...
- 顶 兼容各种浏览器js折叠菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 适合移动手机使用的js环形菜单特效插件
blooming-menu是一款适合在移动手机上使用的js环形菜单插件.该环形菜单提供了众多的參数,通过结合CSS3动画制作出效果很炫酷的圆形菜单展开和隐藏动画效果. 以下是这个圆形菜单菜价的可用參数 ...
随机推荐
- Jni本地多线程回调Java函数,env->findClass()失败。
遇到的问题,Native层本地多线程回调Java函数时env->findClass()失败. 前面的代码是这样的在 JNI_OnLoad记录全局变量g_vm static JavaVM* g_v ...
- STL中关联式容器的特性
1.map 代码如下: /* * map_1.cpp * * Created on: 2013年8月6日 * Author: Administrator */ #include <iostrea ...
- 利用js动态创建<style>
var nod = document.createElement(“style”), str = “body{background:#000;color:#fff} a{color:#fff;text ...
- CSS3-border-radius 属性
向 div 元素添加圆角边框: div { border:2px solid; border-radius:25px; } IE9+.Firefox 4+.Chrome.Safari 5+ 以及 Op ...
- 解决Ubuntu环境变量错误导致无法正常登录
一.问题产生 配置JDK时,按照搜索到的一篇文章中的做法,修改了/etc/profile文件里的内容.在原内容保持不变的基础上,大致添加了以下内容: export JAVA_HOME=.... exp ...
- 截短字符串的函数(JS中适用)
function cutShort(str){ if(str.length>15){ str=str.substr(0,15)+"..."; } ...
- HDU 1251 统计难题 (Trie)
pid=1251">统计难题 Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 131070/65535 K (Java/ ...
- UVA 270 Lining Up (几何 判断共线点)
Lining Up ``How am I ever going to solve this problem?" said the pilot. Indeed, the pilot was ...
- tomcat支持中文文件名下载
http://blog.csdn.net/wnczwl369/article/details/7483806 Tomcat 是Java开发者使用得较多的一个Web服务器,因为它占用资源小,运行速度快等 ...
- Unity Game Starter Kit for Windows Store and Windows Phone Store games
原地址:http://digitalerr0r.wordpress.com/2013/09/30/unity-game-starter-kit-for-windows-store-and-window ...