CN107608664A - 一种使用zTree加载大量数据的方法 - Google Patents
一种使用zTree加载大量数据的方法 Download PDFInfo
- Publication number
- CN107608664A CN107608664A CN201710867682.XA CN201710867682A CN107608664A CN 107608664 A CN107608664 A CN 107608664A CN 201710867682 A CN201710867682 A CN 201710867682A CN 107608664 A CN107608664 A CN 107608664A
- Authority
- CN
- China
- Prior art keywords
- node
- father
- father node
- ztree
- tree
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Withdrawn
Links
Landscapes
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
Abstract
本发明涉及JAVA开发技术领域,特别是一种使用zTree加载大量数据的方法。本发明的方法是首先根据数据量的大小初始化加载的树节点级别,然后根据对树的操作,获取展开的父节点ID,写一个noExpand回调事件的ajax异步方法,获取该父节点下面所对应的子节点信息,再封装到treeNode里面;最终展示出子节点的所有信息。本发明解决了zTree因为加载大数据而导致崩溃的问题;可以用于利用zTree加载大数据。
Description
技术领域
本发明涉及JAVA开发技术领域,特别是一种使用zTree加载大量数据的方法。
背景技术
目前在JAVA开发项目的应用中,程序员经常会使用到zTree的插件在页面上实现树状图的展示或者操作。以往主要用于菜单栏,权限配置,地区配置,部门配置等少量数据的范畴里面。但是如果遇到大量数据的等级分类;直接封装成JSON格式让zTree.node去解析;就会导致页面崩溃报错等现象。这样不但会影响项目进度,还会影响功能的完整性等。如果使用分级加载的解决方案,会确保zTree.node能正确解析出JSON格式数据;还可以减轻页面的加载压力和避免缓存溢出等严重技术问题,有利于线上平台给客户反馈满意的体验效果。
发明内容
本发明解决的技术问题在于提供一种使用zTree加载大量数据的方法;解决zTree加载大量数据时存在的问题。
本发明解决上述技术问题的技术方案是:
所述的方法是:
首先根据数据量的大小初始化加载的树节点级别,然后根据对树的操作,获取展开的父节点ID,写一个noExpand回调事件的ajax异步方法,获取该父节点下面所对应的子节点信息,再封装到treeNode里面;最终展示出子节点的所有信息。
所述的方法具体包括以下步骤:
(1)、分析树节点数据,用SQL语句查询有效的节点总数是多少,用于后面的方法选择;
(2)、生成父节点,先把第一级父节点集合封装到list<treeNode>里面,用json格式传到前端;页面用zTree的jquery插件,把list<treeNode>放到zNode里,编写好zTree的setting配置,setting里面必须配置callback函数noExpand触发事件,再写一个js的触发事件方法expandNode,获取点击展开的父节点的ID,level封装到ajax的方法里面,传到后台java代码运行,根据父节点ID查询出下一个level父ID为父节点ID的树节点集合,再把集合addNode到treeObj上面,添加一个属性值到节点上,用getNodeByParam或者当前父节点位置,updateNode属性flag=true,防止下一次点击展开父节点时会重覆生成树节点出来;后面级别的节点也是按照这样操作;
(3)、生成子节点,后台获取所有对应父ID的子节点集合,封装到list<treeNode>,传到页面上,添加到treeObj;每次点开节点时都会触发noexpand回调事件,根据flag!=true触发ajax方法生成新的树节点。
所述的步骤可以分为:
第1步、准备一张树节点的数据库表;
第2步、在后台的action里写一个树节点的生成方法,设计的逻辑方向是,当传进来的父节点ID为空时,生成前三级的树节点集合;
当传入来的第三级父节点ID不为空,根据父节点ID生成对应的第四级子节点集合,把集合封装到JSON里面;
第3步、在页面上添加zTree的初始化js方法,配置好setting的属性和回调事件,再写一个回调事件noExpand的方法,获取展开任意父节点时传递ID到ajax方法里;
第4步、编辑ajax方法,根据父节点ID传到action里,返回第四级的子节点的JSON集合,添加到对应的父节点下面,然后更新第三级父节点node.flag=“true”。
本发明的有益效果是:
可以防止zTree加载大量JSON数据时异常导致树节点功能失效的情况出现,而且大大改善了页面初始化的响应速度和避免页面卡顿,减轻了服务器的压力和防止内存溢出。
附图说明
下面结合附图对本发明进一步说明:
图1为本发明的实现流程图;
图2为本发明zTree加载数据流程图;
图3为本发明的页面代码截图举例。
具体实施方式
下面将结合附图,对本发明实施例中的技术方案进行清楚、完整的描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出实质性创造获得的方案,都属于本发明保护的范围。
如图1所示,本发明基本实现流程如下:
第1步、准备一张树节点的数据库表,以《国民经济行业分类标准GB/T 4754-2016》的数据信息表为例,总共有1642条数据,总共分为4级类别,其中子节点总数1094条。
第2步、在后台的action里写一个树节点的生成方法,设计的逻辑方向是,当传进来的父节点ID为空时,生成前三级的树节点集合。
当传入来的第三级父节点ID不为空,根据父节点ID生成对应的第四级子节点集合,把集合封装到JSON里面.
第3步、在页面上添加zTree的初始化js方法,配置好setting的属性和回调事件,再写一个回调事件noExpand的方法,获取展开任意父节点时传递ID到ajax方法里.
第4步、编辑ajax方法,根据父节点ID传到action里,返回第四级的子节点的JSON集合,添加到对应的父节点下面,然后更新第三级父节点node.flag=“true”.
第5步、结束。
见图2,本发明zTree加载数据方法如下步骤:
1:分析树节点数据。一个标准的树节点数据库必须有的几个字段:ID,节点名称,节点code,父节点ID,等级,enable,sort。有了这些字段的数据后,便可快捷准确地构建和查找你想要的zTree出来。首先用SQL语句查询有效的节点总数是多少,用于后面的方法选择,例如:select count(*)form表名where enable=1;假如count=2000多条,再找到最后的节点的level是多少,例如level总共有4级,查询SQL则:select count(*)form表名whereenable=1and level!=4;假如count=1000,则我们可以使用分级来获取各层的树节点信息。
2:生成父节点。先把第一级父节点集合封装到list<treeNode>里面,用json格式传到前端。页面用zTree的jquery插件,把list<treeNode>放到zNode里,编写好zTree的setting配置,setting里面必须配置callback函数noExpand触发事件,再写一个js的触发事件方法expandNode,获取点击展开的父节点的ID,level封装到ajax的方法里面,传到后台java代码运行,根据父节点ID查询出下一个level父ID为父节点ID的树节点集合,再把集合addNode到treeObj上面,添加一个属性值到节点上,用getNodeByParam或者当前父节点位置,updateNode属性flag=true,防止下一次点击展开父节点时会重覆生成树节点出来.这样整个解决方法就实现了,后面的三级节点也是按照这样操作,主要把后台的java代码逻辑梳理好,根据level和节点id来获取对应的树节点集合.
3:生成子节点。到了子节点也是同理,后台获取所有对应父ID的子节点集合,封装到list<treeNode>,传到页面上,添加到treeObj.这样每次点开节点时都会触发noexpand回调事件,根据flag!=true触发ajax方法生成新的树节点,
4:结束。
本方法主要利用zTree的callback中的noExpand回调事件,onExpand用于捕获节点被展开的事件回调函数,主要在父节点展开时触发中使用。解决的步骤:首先根据数据量的大小初始化加载的树节点级别,例如父节点总数1000条以下的可以先从后台直接加载封装到treeNode下,这样可以减少后面的代码量和节省开发时间。然后根据对树的操作,获取展开的父节点ID,写一个noExpand回调事件的ajax异步方法,获取该父节点下面所对应的子节点信息。这样的方法可以减少zTree生成时的负担,可以针对解决加载所有数据而导致崩溃的根本原因。假如父节点的总数也超过1000以上,为了zTree的稳定性可以分级来获取树节点,实现方法利用noExpand回调事件获取上一级父节点ID,从后台获取该父节点下一级的节点信息,再封装到treeNode里面,重覆以上步骤,最终展示出子节点的所有信息,虽然这样的处理方法有点繁琐,但是能确保整个树功能的正常使用,避免因为数据量太大导致zTree崩溃的情况出现。
本发明实现的代码可以参考附图3。
Claims (3)
1.一种使用zTree加载大量数据的方法,其特征在于,所述的方法是:
首先根据数据量的大小初始化加载的树节点级别,然后根据对树的操作,获取展开的父节点ID,写一个noExpand回调事件的ajax异步方法,获取该父节点下面所对应的子节点信息,再封装到treeNode里面;最终展示出子节点的所有信息。
2.根据权利要求1所述的方法,其特征在于:所述的方法具体包括以下步骤:
(1)、分析树节点数据,用SQL语句查询有效的节点总数是多少,用于后面的方法选择;
(2)、生成父节点,先把第一级父节点集合封装到list<treeNode>里面,用json格式传到前端;页面用zTree的jquery插件,把list<treeNode>放到zNode里,编写好zTree的setting配置,setting里面必须配置callback函数noExpand触发事件,再写一个js的触发事件方法expandNode,获取点击展开的父节点的ID,level封装到ajax的方法里面,传到后台java代码运行,根据父节点ID查询出下一个level父ID为父节点ID的树节点集合,再把集合addNode到treeObj上面,添加一个属性值到节点上,用getNodeByParam或者当前父节点位置,updateNode属性flag=true,防止下一次点击展开父节点时会重覆生成树节点出来;后面级别的节点也是按照这样操作;
(3)、生成子节点,后台获取所有对应父ID的子节点集合,封装到list<treeNode>,传到页面上,添加到treeObj;每次点开节点时都会触发noexpand回调事件,根据flag!=true触发ajax方法生成新的树节点。
3.根据权利要求2所述的方法,其特征在于:所述的步骤可以分为:
第1步、准备一张树节点的数据库表;
第2步、在后台的action里写一个树节点的生成方法,设计的逻辑方向是,当传进来的父节点ID为空时,生成前三级的树节点集合;
当传入来的第三级父节点ID不为空,根据父节点ID生成对应的第四级子节点集合,把集合封装到JSON里面;
第3步、在页面上添加zTree的初始化js方法,配置好setting的属性和回调事件,再写一个回调事件noExpand的方法,获取展开任意父节点时传递ID到ajax方法里;
第4步、编辑ajax方法,根据父节点ID传到action里,返回第四级的子节点的JSON集合,添加到对应的父节点下面,然后更新第三级父节点node.flag=“true”。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710867682.XA CN107608664A (zh) | 2017-09-22 | 2017-09-22 | 一种使用zTree加载大量数据的方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710867682.XA CN107608664A (zh) | 2017-09-22 | 2017-09-22 | 一种使用zTree加载大量数据的方法 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN107608664A true CN107608664A (zh) | 2018-01-19 |
Family
ID=61057526
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201710867682.XA Withdrawn CN107608664A (zh) | 2017-09-22 | 2017-09-22 | 一种使用zTree加载大量数据的方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN107608664A (zh) |
Cited By (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109408699A (zh) * | 2018-09-14 | 2019-03-01 | 厦门天锐科技股份有限公司 | 一种同步缓存zTree树实现树节点快速检索的方法 |
CN111078763A (zh) * | 2019-12-13 | 2020-04-28 | 厦门市美亚柏科信息股份有限公司 | 基于zTree的树形结构异步提取方法、终端设备及存储介质 |
CN114936069A (zh) * | 2022-05-30 | 2022-08-23 | 易协云(杭州)科技有限公司 | 一种利用脑图进行项目展示的方法及系统 |
Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101408877A (zh) * | 2007-10-10 | 2009-04-15 | 英业达股份有限公司 | 树节点加载系统及其方法 |
CN105468365A (zh) * | 2015-11-20 | 2016-04-06 | 厦门雅迅网络股份有限公司 | 一种解决树控件节点数量限制的方法 |
US20170206188A1 (en) * | 2008-01-02 | 2017-07-20 | International Business Machines Corporation | Manipulation of an ajax tree presentation |
-
2017
- 2017-09-22 CN CN201710867682.XA patent/CN107608664A/zh not_active Withdrawn
Patent Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101408877A (zh) * | 2007-10-10 | 2009-04-15 | 英业达股份有限公司 | 树节点加载系统及其方法 |
US20170206188A1 (en) * | 2008-01-02 | 2017-07-20 | International Business Machines Corporation | Manipulation of an ajax tree presentation |
CN105468365A (zh) * | 2015-11-20 | 2016-04-06 | 厦门雅迅网络股份有限公司 | 一种解决树控件节点数量限制的方法 |
Non-Patent Citations (1)
Title |
---|
酸辣青椒土豆丝: "https://blog.csdn.net/u010951692/article/details/51833077", 《ZTREE学习(二):异步加载树结构》 * |
Cited By (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109408699A (zh) * | 2018-09-14 | 2019-03-01 | 厦门天锐科技股份有限公司 | 一种同步缓存zTree树实现树节点快速检索的方法 |
CN109408699B (zh) * | 2018-09-14 | 2022-02-08 | 厦门天锐科技股份有限公司 | 一种同步缓存zTree树实现树节点快速检索的方法 |
CN111078763A (zh) * | 2019-12-13 | 2020-04-28 | 厦门市美亚柏科信息股份有限公司 | 基于zTree的树形结构异步提取方法、终端设备及存储介质 |
CN111078763B (zh) * | 2019-12-13 | 2022-11-11 | 厦门市美亚柏科信息股份有限公司 | 基于zTree的树形结构异步提取方法、终端设备及存储介质 |
CN114936069A (zh) * | 2022-05-30 | 2022-08-23 | 易协云(杭州)科技有限公司 | 一种利用脑图进行项目展示的方法及系统 |
CN114936069B (zh) * | 2022-05-30 | 2024-03-22 | 易协云(杭州)科技有限公司 | 一种利用脑图进行项目展示的方法及系统 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN108038222B (zh) | 用于信息系统建模和数据访问的实体-属性框架的系统 | |
JP7419244B2 (ja) | 例によるetlルールの学習 | |
CN106528129B (zh) | 一种Web应用界面生成系统及方法 | |
US9483257B2 (en) | Universal and adaptive software development platform for data-driven applications | |
CN106202207B (zh) | 一种基于HBase-ORM的索引及检索系统 | |
CN101651576B (zh) | 告警信息处理方法和系统 | |
CN107608664A (zh) | 一种使用zTree加载大量数据的方法 | |
US20180365272A1 (en) | Concurrent enumeration of multiple hierarchies in a database environment | |
CN105511843A (zh) | 一种生成应用程序界面的方法和装置 | |
CN107368346A (zh) | 一种基于元数据和脚本引擎的代码生成方法及装置 | |
CN103914290A (zh) | 一种操作命令处理方法及装置 | |
CN109408699A (zh) | 一种同步缓存zTree树实现树节点快速检索的方法 | |
CN105786522A (zh) | 基于Node.js平台的WEB前端通用组件 | |
CN115469941A (zh) | 基于FlinkSQL的风控指标计算开发的自动配置处理方法及系统 | |
CN114443646A (zh) | 基于双向线性链表目录检索的多叉树结构、电子设备及可读存储介质 | |
CN109933589B (zh) | 用于数据汇总的基于ElasticSearch聚合运算结果的数据结构转换方法 | |
US6748388B1 (en) | Method and mechanism for storing and managing self-descriptive heterogeneous data | |
US20030200522A1 (en) | Method and apparatus for hierarchically restructuring portions of a hierarchical database based on selected attributes | |
CN103593188A (zh) | 一种用于仪器所见即所得菜单的管理系统及管理方法 | |
CN108681462A (zh) | 一种代码量统计方法及装置 | |
WO2018038065A1 (ja) | 情報管理装置並びにファイル管理方法 | |
WO2024026931A1 (zh) | 面向数据资产增值的大数据加工成形方法与模型 | |
CN105335160A (zh) | 一种基于jsf的web端组件敏捷开发方法 | |
CN110162531B (zh) | 一种分布式并发数据处理任务决策方法 | |
KR102628135B1 (ko) | 시리얼화 방법, 역시리얼화 방법, 정보 처리 프로그램, 정보 처리 장치 및 통신 시스템 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
WW01 | Invention patent application withdrawn after publication | ||
WW01 | Invention patent application withdrawn after publication |
Application publication date: 20180119 |