| Class Summary | |
| Jtree | Jtree (树形类) |
| Field Summary | |
| Array | param 构建树所需参数 |
| Array | setting 设置Jtree的属性 |
| Method Summary | |
| Object | init(treebody,setting,param); 加载树 |
| void | quickPosition(text); 快速定位树节点 |
| void | cancelSelectedNode(node); 取消选中节点 |
| void | expandAll(); 展开所有节点 |
| void | expandNode(node, expandFlag, sonSign, focus, callbackFlag); 展开节点 |
| Object | getNodes(); 获取树的节点 |
| Object | getNodeByParam(key, value, parentNode); 根据参数获取节点 |
| Object | getNodeByTId(tId); 根据节点ID获取节点 |
| Object | getNodesByParam(key, value, parentNode); 根据参数获取节点(多个) |
| int | getNodeIndex(node); 获取节点的序号 |
| Object | getSelectedNodes(); 获取选中的节点(多个) |
| boolean | isSelectedNode(node); 判断节点是否被选中 |
| boolean | reAsyncChildNodes(parentNode, reloadType, isSilent); 是否为异步加载子节点 |
| void | refresh(); 刷新树 |
| void | selectNode(node, addFlag); 选中指定节点 |
| Array | transformToArray(nodes); 将多个节点转换成数组 |
| void | updateNode(node, checkTypeFlag); 更新节点 |
| Object | getSetting(); 获取树的配置信息 |
{Array}param
[attribute]构建树需要的参数
Example:
var param = {
cell : {
id : "SID",//设置构建树的id
name : "SNAME",//树显示的名称
parent : "SPARENT",//表示树的层级
other:"SFID,SFNAME,SORGKINDID",//其他字段用逗号格开
tableName : "SA_OPOrg",//对应的表名
databaseName:"system", //数据库连接名
rootFilter : " SCODE<>'SYSTEM' and SPARENT is null", //跟节点条件
orderby : "SSEQUENCE asc" //排序字段
}
};
{Array}setting
[attribute]设置Jtree属性
Example:
var setting = {
view: {
selectedMulti: false, //设置是否允许同时选中多个节点。默认值: true
autoCancelSelected: false,//点击节点时,按下 Ctrl 键是否允许取消选择操作。
dblClickExpand: true //双击节点时,是否自动展开父节点的标识
},
data : {
simpleData : {//初始化时的节点数据、异步加载时的节点数据
enable : true
}
},
async : {
enable : true,//设置是否开启异步加载模式
url : "TreeSelectAction",//需要加载的Action
autoParam: ["id=currenid"]//异步加载时需要自动提交父节点属性参数。[setting.async.enable = true] 时生效
type:"post"//提交方式
},
isquickPosition :{
enable : true, //是否有快速查询框
url:"QuickTreeAction",
quickCells : "SCODE,SNAME",//用于快速查询的字段
path : "SFID"//查询路径字段
}
},
edit:{
enable:true,//设置 Tree 是否处于编辑状态
showRemoveBth:true,//设置是否显示删除按钮
showRenameBtn: true,//设置是否显示编辑名称按钮
drag:{
prev:true,//拖拽到目标节点时,设置是否允许移动到目标节点前面的操作
inner:true,//拖拽到目标节点时,设置是否允许成为目标节点的子节点
next:true,//拖拽到目标节点时,设置是否允许移动到目标节点后面的操作
isCopy:false,//拖拽时, 设置是否允许复制节点
isMove:true//拖拽时, 设置是否允许移动节点
}
},
callback:{
beforeDrag:beforeDrag,//用于捕获节点被拖拽之前的事件回调函数
beforeDrop: zTreeBeforeDrop,//用于捕获节点拖拽操作结束之前的事件回调函数
onRename: zTreeOnRename,//用于捕获节点编辑名称结束(Input 失去焦点 或 按下 Enter 键)之后
beforeRemove: zTreeBeforeRemove//用于捕获节点被删除之前的事件回调函数
}
}
Object Jtree.init(treebody,setting,param);
加载事件(在显示树的UL标签中注册)
Returns:
{Object}
Example: <html><head></head><body>
<div class="zTreeDemoBackground left">
<ul id="JtreeDemo" class="ztree"></ul>
</div>
</body></html>
<script type="text/javascript" language="javascript">
var param = {
cell : {
id : "SID",//设置构建树的id
name : "SNAME",//树显示的名称
parent : "SPARENT",//表示树的层级
other:"SFID,SFNAME,SORGKINDID",
tableName : "SA_OPOrg",//对应的表名
databaseName:"system"//数据库
}
};
var setting = {
view: {
selectedMulti: false, //设置是否允许同时选中多个节点。默认值: true
autoCancelSelected: false,
dblClickExpand: true
},
data : {
simpleData : {
enable : true//确定 JTree 初始化时的节点数据
}
},
async : {
enable : true,//异步
url : "TreeSelectAction",//异步交互的action
autoParam : [ "id=currenid" ] ,//异步需要的参数
type: "post"
},
isquickPosition : {
enable : false, //是否有快速查询框
url : "TreeSelectAction"
},
edit:{
enable:true,//设置 Tree 是否处于编辑状态
showRemoveBth:true,//设置是否显示删除按钮
showRenameBtn: true,//设置是否显示编辑名称按钮
drag:{
prev:true,//拖拽到目标节点时,设置是否允许移动到目标节点前面的操作
inner:true,//拖拽到目标节点时,设置是否允许成为目标节点的子节点
next:true,//拖拽到目标节点时,设置是否允许移动到目标节点后面的操作
isCopy:false,//拖拽时, 设置是否允许复制节点
isMove:true//拖拽时, 设置是否允许移动节点
}
},
callback:{
beforeDrag:beforeDrag,
beforeDrop: zTreeBeforeDrop,
onRename: zTreeOnRename,//用于捕获节点编辑名称结束(Input 失去焦点 或 按下 Enter 键)之后
beforeRemove: zTreeBeforeRemove
}
}
var JtreeDemo = new Jtree();
var treebody = "JtreeDemo"
JtreeDemo.init(treebody, setting, param);
</script>
void quickPosition(text)
快速定位树节点(模糊查询)
Parameters:
text
{string}[required]需要定位的节点文本
Returns:
{void}
Example:
var setting = {
view: {
selectedMulti: false, //设置是否允许同时选中多个节点。默认值: true
autoCancelSelected: false,
dblClickExpand: true
},
data : {
simpleData : {
enable : true
}
},
async : {
enable : true,
url : "getTreeSourAction",
autoParam: ["id=currenid"]
},
isquickPosition :{
enable : fase, //是否有快速查询框
url:""
}
};
<input id="buttondemo" type="button" value="快速定位" onclick="quickQuery();"/>
var text=$("#buttondemo").val();
function quickQuery(){
Jtree.quickPosition(text);
}