- 浏览: 232135 次
- 性别:
- 来自: 北京
文章分类
最新评论
Ztree 支持中文API 实在太easy 了, 有了API 就是查询速度问题,记下一些方法
1.初始化树, 选中并展开根节点
2.Ztree 最简单的方式一次加载所有数据
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");
发表评论
-
web界面父子页面互相调用
2017-10-27 14:25 635父页面:parent.html <!DOCT ... -
多选下拉框的回显(Select)
2015-10-20 17:29 10478多选下拉框打印时候是已数组形式展现的,按这种思路: &l ... -
jqgrid 网址
2015-05-13 16:41 583http://www.trirand.com/blog/jqg ... -
JQuery EasyUI combobox动态添加option
2015-03-20 09:41 1767<input class="easyui-c ... -
easy datagrid 获得page信息
2015-02-03 11:07 650var grid = $('#datagrid'); va ... -
easy ui datagrid api
2015-01-29 12:58 717http://www.jeasyui.com/document ... -
扩展easy ui tree 层级(level)
2014-12-22 10:38 872$.extend($.fn.tree.methods, { ... -
jquery 下拉框按text 选中
2014-11-18 16:03 542jQuery("#separator option[ ... -
jqGrid增加滚动条
2014-10-28 10:15 1960滚动条: $(xxx).jqGrid({ ...... aut ... -
jQuery ui 多选下拉
2014-09-25 11:49 1029下载及代码:http://www.erichynds.com/ ... -
jqGrid 行编辑(select事件)动态追加控件(操作)
2014-09-15 11:26 7478在某个控件后面, 追加一个控件, 在某个控件下面设置 ... -
jQuery validate 自定义样式、规则
2014-09-12 17:07 1510jquery validate 常用的找Api 就好, 但有一 ... -
jqGrid自动适应窗口大小
2014-09-01 17:41 809$(window).resize(function(){ ... -
jqGrid 编辑自定义控件
2014-08-15 16:12 2414jqGrid 支持在某一列上,自己写一个控件显示,并影响弹出编 ... -
针对Ztree的右键弹出菜单(jquery.popupSmallMenu.js)
2014-08-14 10:21 6470例子效果: 右键菜单方便好用的有很多,长用的为jque ... -
jquery ui Message 简单使用
2014-08-12 10:09 1265可以自己在前面加上一张图片 通过operation判断 用哪张 ... -
jQuery ui Combobox 扩展
2014-08-07 15:16 1465jQuery ui 是一个UI的雏形, 一些UI都基于 ... -
jQuery layout 插件属性
2014-07-30 16:08 1662相信很多人在用layout的时候都会找layout到底有多少属 ... -
jqGrid 两种列模型(TypeError: b is undefined)
2014-07-23 18:06 1063jqGrid 的json支持两种列模型 1:如果用普通的js ... -
BS UI
2014-07-21 16:07 383http://www.bootcss.com/ 支持IE6 ...
相关推荐
3. **font**:这部分可能包含自定义的字体图标,zTree常用图标来表示节点的状态(如展开、折叠、选中等),这些图标可能以Web字体或SVG格式存储。 4. **ztree**:这个文件夹很可能是zTree的JavaScript库本身,包括...
这些示例涵盖了zTree的常用功能,如基本展示、多选、异步加载、拖拽排序等,开发者可以通过查看和运行这些示例,快速掌握zTree的使用方法。 总结,JQuery zTree v2.6是一款强大且易用的树形插件,它的API文档和实例...
本文将基于zTreeAPI_v2.5的官方文档,深入探讨其核心功能、参数配置以及常用方法,旨在帮助开发者更好地理解和应用zTree。 #### zTree核心函数 - **zTree(setting,[zTreeNodes])**:这是创建zTree实例的核心函数。...
EasyUI和ZTree是两个在Web开发中常用的前端框架,尤其在构建后台管理系统时非常受欢迎。EasyUI基于jQuery,提供了一系列的UI组件,如表格、下拉框、对话框等,使得开发者能够快速构建出美观且功能丰富的界面。而...
分页功能是数据库查询中常用的一种优化手段,尤其在处理大量数据时,通过分页可以避免一次性加载所有数据导致的性能问题。在ztreeDemo中,IbatisNet可能被用来实现查询结果的分页展示,让用户能够逐步加载和浏览树形...
Bootstrap、Select2 和 ZTree 是三个在Web开发中常用的库,它们分别提供了不同的功能,而将它们整合在一起可以实现更复杂的交互式用户界面。这里我们将深入探讨这些库以及如何将它们结合来创建一个下拉框带树结构的...
zTree 是利用 JQuery 的核心代码,实现一套能完成大部分常用功能的 Tree 插件。它与 IE、FireFox、Chrome 等浏览器保持兼容,在一个页面内可同时生成多个Tree 实例,支持一次性静态生成和Ajax 异步加载两种方式,...
zTree方法详解(常用),拖拽功能,方法集成,权限功能setting配置详解
zTree 是利用 JQuery 的核心代码,实现一套能完成大部分常用功能的 Tree 插件 兼容 IE、FireFox、Chrome 等浏览器,easyUI1.4与ztree3.5结合开发,ztree帮助文档对初用者很有帮助......
Bootstrap、ZTree 和 Table 是三个在 Web 开发中常用的组件,它们各自有着独特的作用,但也可以结合使用以创建更复杂的用户界面。在此,我们将详细探讨这三个技术及其在实际项目中的结合应用。 Bootstrap 是一个...
zTree的API是其强大功能的关键,以下是一些常用API的解释: 1. `$.fn.zTree.init`: 初始化zTree,设置基本配置项和节点数据。 2. `treeObj.reAsyncChildNodes`: 异步加载子节点数据,适用于大数据量场景。 3. `...
此外,还提供了多种演示示例,涵盖了zTree的常用功能,如单选、多选、拖拽、右键菜单等,这些实例对于初学者理解和上手非常有帮助。 5. **实际应用** 在实际项目中,zTree可以用于构建用户权限管理界面,展示文件...
`jQuery zTree` 以其丰富的功能和易用性,成为了开发中常用的一款树形组件。通过熟练掌握其 API 和事件机制,开发者能够轻松创建出满足需求的树形界面,提升用户体验。无论是简单还是复杂的树形结构,zTree 都能提供...
【ztree】与【jstree】都是在Web开发中常用的JavaScript树形插件,用于在网页上展示层级结构的数据,如目录、组织结构、菜单等。这两个插件都提供了丰富的功能和高度的可定制性,使得开发者可以方便地创建交互式的...
以下是一些常用API: 1. **init()**:初始化zTree,接收节点数据和配置参数。 2. **setting()**:设置或获取zTree的配置项,包括数据、显示、操作、事件等方面。 3. **getTree()**:获取整个树形结构的数据对象。 4...
文档“zTree.doc”可能涵盖了zTree的基本概念、安装方法、基本配置以及常用方法。在zTree的基本概念部分,你可能会了解到如何创建一个基本的树结构,包括节点的定义、父节点与子节点的关系、叶子节点的概念等。安装...
3. `demo`目录:提供了多个示例,涵盖了zTree的常用功能,如异步加载、拖拽操作、多选模式等。 压缩包2——"zTree_v3-master2.rar",是作者自己实现的下拉树实例。在`ztreeinput`文件夹中,我们可以找到作者如何将...
`demo`目录包含了一系列示例代码,覆盖了zTree的常用功能,例如: 1. **基本用法**:展示了最简单的树形结构,包括节点的基本操作。 2. **异步加载**:演示了如何动态加载子节点,适用于数据量庞大的情况。 3. **...
- **常用方法**: - `getNodeByParam(key, value, parentNode)`:根据节点数据的属性搜索,获取条件完全匹配的节点数据 JSON 对象。 - `key`:需要精确匹配的属性名称。 - `value`:需要精确匹配的属性值。 - `...