Ztree 支持中文API 实在太easy 了, 有了API 就是查询速度问题,记下一些方法
1.初始化树, 选中并展开根节点
var ztree;
function initDeptTree() {
var setting = {
async: {
enable: true,
url: "deptTreeQuery.action",
autoParam:["deptId=deptId"],
dataType: "json"
},
data: {
key: {
name: "deptName"
},
simpleData: {
enable: false,
idKey: "deptId",
pIdKey: "parentId"
}
},
callback: {
onClick: selectedTree,
onRightClick: rightClick,
onAsyncSuccess: asyncSuccess
//onExpand: zTreeOnExpand
},
view: {
selectedMulti: false
}
};
$.fn.zTree.init($("#deptTree"), setting);
ztree = $.fn.zTree.getZTreeObj("deptTree");
}
function asyncSuccess(event, treeId, treeNode, msg) {
if(treeNode == null) {//root
var rootNode = ztree.getNodes()[0];
ztree.selectNode(rootNode);
ztree.expandNode(rootNode, true, false, true);
}
}
2.Ztree 最简单的方式一次加载所有数据
数据:
[{"deptId":"2","deptName":"cc","parentId":"rootId","description":"cc","pId":"rootId","isParent":true}, {"deptId":"FCF370CA-2200-0FCC-BD5E-588245FE8A17","deptName":"test23","parentId":"rootId","pId":"rootId","isParent":true}, {"deptId":"1","deptName":"test45","parentId":"rootId","pId":"rootId","isParent":true}, {"deptId":"070010F2-547B-30FE-BAC3-70F06C72C4F4","deptName":"test4","parentId":"rootId","pId":"rootId","isParent":true}]
设置:simpleData.enable = true
然后每条记录只要把parentId设置好就OK(通常数据表数据直接查回来即满足).
basicSetting.async = {};
basicSetting.data.simpleData.enable = true;
basicSetting.callback = {
beforeClick : function(treeId, treeNode, clickFlag){
return !!(treeNode.parentId); //Dont't root dept node selected when user edit.
},
onClick: selectedDeptTreeEditUser,
onAsyncSuccess: function(event, treeId, treeNode, msg) {
if(treeNode == null) {//root
var rootNode = deptZtree.getNodes()[0];
deptTreeEditUserZtree.selectNode(rootNode);
deptTreeEditUserZtree.expandNode(rootNode, true, false, true);
}
}
};
var zNodes = [];
$.ajax({
url : "deptTreeQuery.action?allQueryflag=1",
type : 'post',
async : false,
cache: false,
dataType: 'json',
data : {
},
success : function(data) {
zNodes = data;
}
});
$.fn.zTree.init($("#deptTreeEditUser"), basicSetting, zNodes);
deptTreeEditUserZtree = $.fn.zTree.getZTreeObj("deptTreeEditUser");