# Django MPTT easyui

## 测试指令
按照MPTT的文档,先创建模型,然后添加数据

from django.db import models
from mptt.models import MPTTModel, TreeForeignKey
class Genre(MPTTModel):
name = models.CharField(max_length=50, unique=True)
parent = TreeForeignKey('self', null=True, blank=True, related_name='children', db_index=True)

#class MPTTMeta:
# order_insertion_by = ['name']

注意把order_insertion_by 这里删除。因为在转json输出的时候,按照mptt的lft,id这两个排序。

先清空数据库

from myapp.models import Genre
Genre.objects.all().delete()

创建树节点

from myapp.models import Genre
rock = Genre.objects.create(name="Rock")
blues = Genre.objects.create(name="Blues")
hr = Genre.objects.create(name="Hard Rock", parent=rock)
pr = Genre.objects.create(name="Pop Rock", parent=rock)
Genre.objects.create(name="Hard Rock1", parent=hr)
Genre.objects.create(name="Hard Rock3", parent=hr)
Genre.objects.create(name="Hard Rock2", parent=hr)

## 直接显示mptt

def show_genres(request):
nodes = Genre.objects.all()
#print(nodes)
return render_to_response('genres.html', {'nodes': nodes})

## mptt转json
[fastest way to create JSON to reflect a tree structure in Python / Django using mptt](http://stackoverflow.com/questions/12556268/fastest-way-to-create-json-to-reflect-a-tree-structure-in-python-django-using/12556693)

按照stackflow上的做法,为了快速输出,需要mptt和cache相关的api。然而我这里并不需要快速,额外的要求是输出的顺序,即插入顺序。

def recursive_node_to_dict(node):

result = {
'name': node.name, 'id': node.pk,
#notice the use of node._cached_children instead of node.get_children()
'children' : [recursive_node_to_dict(c) for c in node.get_children().order_by('lft', 'id')]
}

return result

def mptt_json(subTrees):

subRootDicts = []
for subTree in subTrees:
subTree = recursive_node_to_dict(subTree)
subRootDicts.append(subTree)

jsonTree = json.dumps(subRootDicts, indent=4)
print(jsonTree)
# optional clean up, remove the [ ] at the beginning and the end, its needed for D3.js
# jsonTree = jsonTree[1:len(jsonTree)]
# jsonTree = jsonTree[:len(jsonTree)-1]
return jsonTree

def get_tree(request):
rootM = Genre.objects.order_by('lft', 'id').filter(level=0)
json_data = mptt_json(rootM)
# print(json_data)
return HttpResponse(json_data,content_type="application/json")

## easyui加载mptt的数据

<table id="tg" class="easyui-treegrid" title="TreeGrid ContextMenu" style="width:700px;height:250px"
data-options="
iconCls: 'icon-ok',
rownumbers: true,
animate: true,
collapsible: true,
fitColumns: true,
url: '/demo/get_tree/',
method: 'get',
idField: 'id',
treeField: 'name'
">
<thead>
<tr>
<th data-options="field:'name',width:180">Task Name</th>
</tr>
</thead>
</table>

转载于:https://www.cnblogs.com/panpeter/p/6400286.html

使用mptt在easyui中显示树形结构相关推荐

  1. Winform中实现向窗体中拖放照片并显示以及拖放文件夹显示树形结构(附代码下载)

    场景 向窗体中拖拽照片并显示效果 向窗体中拖拽文件夹并显示树形结构效果 注: 博客主页: https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的程序猿 ...

  2. ztree和php结合实例,实例详解jQuery EasyUI结合zTree树形结构制作web页面

    JQuery EasyUI 结合 zTree树形结构制作web页面.easyui用起来比较简单,很好的封装了jquery的部分功能,使用起来更加方便,但是从1.2.3版本以后,商业用途是需要付费的,z ...

  3. Excel表格中建立树形结构

    Excel表格中建立树形结构 2010-04-05 17:56:37|  分类: 开发笔记 |字号 订阅 有时在excel表格中需要建立树形结构,如下图所示. 对动物.植物进行分类. 动物.植物类中分 ...

  4. EasyUI之Tree树形结构(一)

    官网地址:www.jeasyui.net/plugins/186- 前端代码: $("#menuTreegrid").treegrid({url: SysResource.URL. ...

  5. 把数据转换为在内存中Tree(树形结构)。_备战秋招:一文搞定数据库常见面试题...

    点击上方"蓝字",关注了解更多 1.数据库范式 第一范式:列不可分,eg:[联系人](姓名,性别,电话),一个联系人有家庭电话和公司电话,那么这种表结构设计就没有达到 1NF: 第 ...

  6. word文档中显示目录结构、插入目录

    要使word中左侧显示目录结构,选择菜单栏"视图"--"文档结构图". 如果没有找到"文档结构图",可以自定义添加后重新上述操作. 要插入目 ...

  7. Flex4 在advanceddatagrid组件中以“树形结构”显示数据

    2019独角兽企业重金招聘Python工程师标准>>> flex前台页面: <?xml version="1.0" encoding="utf-8 ...

  8. java中dom树形结构_DOM树的结构

    转载于:http://hi.baidu.com/leexper/blog/item/1c47f1112c1d3676ca80c4a9.html 一.引言 XML 是eXtensible Markup ...

  9. 把数据转换为在内存中Tree(树形结构)。_Linux的中断处理机制 [二] - 数据结构(2)...

    Linux的中断处理机制 [一] - 数据结构(1) 上文提到,每个IRQ同时有"irq"和"hwirq"两个编号.这里"hwirq"是硬件 ...

  10. 在vue项目中使用树形结构的穿梭框

    先看一下最后的效果: 一个基于elementui的穿梭框组件:el-tree-transfer 第一步:安装组件 npm install el-tree-transfer --save 第二步:写代码 ...

最新文章

  1. EntityFramework:状态变化与方法的关系
  2. 数据结构和算法:全面的算法代码库
  3. TCPIP / MTU 和 MSS 的区别和联系
  4. 【期望】期望收益(金牌导航 期望-3)
  5. 微信小程序登录 更新中
  6. windows下手动配置ipv6地址
  7. 配置实体框架DbContext的可扩展方案
  8. linux 错误信息 输出到管道,linux grep通过管道输出到head出现write error: Broken pipe错误...
  9. JSK-383 是否闰年(课后)【入门】
  10. 【C语言】头文件书写方法与规范、code::black中如何创建并编写头文件(一看就会)
  11. 办公小技巧:excel删除重复项
  12. 基于xlsx-populate实现的前端埋点导出
  13. 【037】PhotoMosh–艺术故障图片在线生成器
  14. 全新解密域名防红系统源码,支持分站
  15. 使用Google语音识别引擎(Google Speech API)
  16. 动态规划统计正方形子矩阵
  17. 对计算的理解计算机科学导论论文,计算机科学导论论文
  18. 中序和先序、中序和后序
  19. 瘦客户机、Windows终端和NC的差别
  20. 抖音上的时钟屏保,被我改造完用来表白

热门文章

  1. 数据分享 | 高光谱遥感影像数据集汇总
  2. Python 读取/存储 yaml 文件
  3. ValueError: Object arrays cannot be loaded when allow_pickle=False 报错解决
  4. Linux 命令之——文件行数查询命令温习
  5. 使用Robomongo 连接MongoDB 3.x 报 Authorization failed 解决办法(转)
  6. mysql算大型数据库吗_mysql – 估计大型数据库的大小和速度
  7. chrome 模拟点击_详解爬虫模拟登陆的三种方法
  8. 复选框选中的值怎么传到mysql_PHP中如何将复选框选中的内容提交到mysql的一个字段中...
  9. Java 中isEmpty和null、 的区别
  10. JavaSE基础——代码块、继承、方法重写和final关键字