无限分级和tree结构数据增删改

阅读目录

•无限分级
•jstree插件
•Demo
•创建Region实体
•满足jstree插件的数据对象Dto
•数据转换
•初始化获取转换后的数据
•前台数据加载
•其他操作
•通过按钮来操作增删改

无限分级

很多时候我们不确定等级关系的层级，这个时候就需要用到无限分级了。

说到无限分级，又要扯到递归调用了。（据说频繁递归是很耗性能的），在此我们需要先设计好表机构，用来存储无限分级的数据。当然，以下都是自己捣鼓的结果，非标准。谁有更好的设计望不吝啬赐教。

说来其实也简单，就是一个ID和父ID的关系。

以此类推，Id需要是唯一的，ParenId需要是Id列里面存在即可。这样我们就实现无限分级了，如果再加一列Sort排序就更完美了。

jstree插件

官方地址：https://www.jstree.com/

为什么要用这个插件？因为有方便的api给我们做数据绑定，且支持节点拖动来实现增删改，个人觉得这个功能挺强大的。

Demo

下面我们来基于jstree插件来实现无限分级数据操作。以区域数据操作为例，用Code First的方式来编写demo代码。

创建Region实体

为了配合插件自动生成的节点id，我们这里使用的Node和ParentNode来存储上下级关系（而不是上面说的id和parentid，但是实际效果是一样的）。

满足jstree插件的数据对象Dto

为了适应jstree插件的数据要求，我们需要把上面的数据转换成树状的数据对象。

数据转换

初始化获取转换后的数据

以上后台的数据差不多就完成了。

前台数据加载

其他操作

当然，记得修改或是删除要取RegionsId这个对应后台实体的ID。

通过按钮来操作增删改

上面是我整理给大家的，希望今后会对大家有帮助。

相关文章：

非常实用的ajax用户注册模块

Ajax点击不断加载数据列表（图文教程）

Ajax+Struts2实现验证码验证功能（图文教程）

以上就是无限分级和tree结构数据增删改的详细内容，更多请关注Gxl网其它相关文章！