在使用easyUI 的treeGrid的时候,很多时候我们从数据库取出来的数据treeGrid却不能读取显示成一个树:如下

{
menuCode: "a00",
menuName: "管理员首页",
menuUrl: "/main/admin/index.action",
menuPCode: "-1",
isLeaf: "0",
status: "1",
icon: null,
createUser: "system",
createDate: "2014-01-24 17:10:25",
modifyUser: "system",
modifyDate: "2014-01-24 17:10:25"
},
{
menuCode: "a0001",
menuName: "修改密码",
menuUrl: "/main/admin/modifyPwd.action",
menuPCode: "a00",
isLeaf: "1",
status: "1",
icon: null,
createUser: "system",
createDate: "2014-01-24 17:10:25",
modifyUser: "system",
modifyDate: "2014-01-24 17:10:25"
},
{
menuCode: "a0002",
menuName: "图片上传",
menuUrl: "/image/admin/uploadImage.action",
menuPCode: "a00",
isLeaf: "1",
status: "1",
icon: null,
createUser: "system",
createDate: "2014-01-24 17:10:25",
modifyUser: "system",
modifyDate: "2014-01-24 17:10:25"
}

例如以上是我从数据库表中取的值并转化为json格式,逻辑上我是靠menuCode和menuPcode来表示父子的继承关系,但是easyUI的treeGrid不买账,她可不会理解你的父子关系是通过menuCode和menuPcode表现的

于是乎有人觉得json格式应该如下:

通过设置children来方便treeGrid解析,于是乎有人开始对取出来的表数据进行遍历啊,拼接字符串啦之类的操作,往这个格式上拼凑,其实完全没必要

解决办法:

使用谷歌浏览器打开如下链接

http://www.jeasyui.net/demo/581.html

F12查看该例子树形数据表格的数据格式:

数据格式为:

{"total":9,"rows":[
{"id":1,"region":"Wyoming"},
{"id":11,"region":"Albin","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":1},
{"id":12,"region":"Canon","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":1},
{"id":13,"region":"Egbert","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":1},
{"id":2,"region":"Washington"},
{"id":21,"region":"Bellingham","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":2},
{"id":22,"region":"Chehalis","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":2},
{"id":23,"region":"Ellensburg","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":2},
{"id":24,"region":"Monroe","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":2}
],"footer":[
{"region":"Total","f1":14000,"f2":12600,"f3":13321,"f4":15281,"f5":14931,"f6":13461,"f7":14126,"f8":12866}
]}

属性表格加载正确的前提是json数据中要正确初始化_parentId节点。

treeGrid树形数据表格的json数据格式说明的更多相关文章

  1. Layui数据表格模型

    视图模型 package com.meiyou.model; import org.springframework.context.annotation.Bean; import java.io.Se ...

  2. 如何构建JSON数据,JSON数据的格式,JSON数据的获取

    假设你是用$.getJSON();方法获取JSON数据$.getJSON(url,{"Action":"getStudent"},function(data){ ...

  3. 数据网格和树-EasyUI Datagrid 数据网格、EasyUI Propertygrid 属性网格、EasyUI Tree 树、EasyUI Treegrid 树形网格

    EasyUI Datagrid 数据网格 扩展自 $.fn.panel.defaults.通过 $.fn.datagrid.defaults 重写默认的 defaults. 数据网格(datagrid ...

  4. TreeGrid( 树形表格)

    本节课重点了解 EasyUI 中 TreeGrid(树形表格)组件的使用方法,这个组件依赖于DataGrid(数据表格)组件 一. 加载方式//建立一个 JSON 文件[{"id" ...

  5. 第二百二十八节,jQuery EasyUI,TreeGrid(树形表格)组件

    jQuery EasyUI,TreeGrid(树形表格)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 TreeGrid(树形表格)组件的使 ...

  6. struts2将数据通过Json格式显示于EasyUI-datagrid数据表格

    1.搭建ssh开发环境 2.写好Dao.service等方法 3.建立DTO数据传输对象: package com.beichende.sshwork.user.web.dto; import jav ...

  7. table-tree 表格树、树形数据处理、数据转树形数据

    前言 公司想搞个表格树的展示页面,看着element有个表格树,还以为可以用. 用出来只用表格没有树,研究半天没研究个所以然,只能从新找个 npm里找到一个:vue-table-with-tree-g ...

  8. $Django ajax简介 ajax简单数据交互,上传文件(form-data格式数据),Json数据格式交互

    一.ajax  1 什么是ajax:异步的JavaScript和xml,跟后台交互,都用json  2 ajax干啥用的?前后端做数据交互:  3 之前学的跟后台做交互的方式:   -第一种:在浏览器 ...

  9. 【整理】treeGrid 树形表格

    treeGrid 树形表格 https://fly.layui.com/extend/treeGrid/

随机推荐

  1. C++中explicit关键字的使用

    看书看到了explicit关键字,就来做个笔记,讲得比较明白,比较浅. 在C++中,我们有时可以将构造函数用作自动类型转换函数.但这种自动特性并非总是合乎要求的,有时会导致意外的类型转换,因此,C++ ...

  2. 2016 - 1 - 25 CSS初步 (二)

    1.The customising link We can change the link's style when we move our pointer on the link like that ...

  3. [转]sed命令详解

    转载:http://blog.chinaunix.net/u/22677/showart_1076318.html   1.简介 sed是非交互式的编辑器.它不会修改文件,除非使用shell重定向来保 ...

  4. [BZOJ 3223 & Tyvj 1729]文艺平衡树 & [CodeVS 3243]区间翻转

    题目不说了,就是区间翻转 传送门:BZOJ 3223 和 CodeVS 3243 第一道题中是1~n的区间翻转,而第二道题对于每个1~n还有一个附加值 实际上两道题的思路是一样的,第二题把值对应到位置 ...

  5. Ansible-Tower快速入门-3.快速开始【翻译】

    快速开始 当你完成安装tower后,我们应该完成接下来的一些任务,并通过使用tower,快速设置和启动我们的第一个ansible playbooks.这第一个playbooks的启动会执行简单的ans ...

  6. onTouch与onClick冲突解决方法

    view.setOnTouchListener(new OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent ...

  7. 第三个Sprint冲刺事后诸葛亮报告

    用户反馈:还好吧. 用户数量:4 团队改进建议:思维局限太大,技术需要革新. 1.每个成员第一个sprint阶段有何需要改进? 成员 需要改进 邵家文 需要提高自己的工作效率,与创新能力,解决问题的能 ...

  8. VB 中Sub和Function的区别

    Sub可以理解为执行一个过车,一个操作. Function在执行完过后,还要返回一个结果. Sub:过程:Function:函数,可以带返回值. 语法: Sub SubName(参数1,参数2,... ...

  9. Android模拟器Genymotion如何访问本地服务器?

    Genymotion能否访问到本地服务器,其实与Genymotion本身并无太大关系.Genymotion作为VirtualBox中的一个虚拟OS运行,所以它访问网络的方式与其他VirtualBox中 ...

  10. HBase学习笔记-HBase性能研究(1)

    使用Java API与HBase集群交互时,需要构建HTable对象,使用该对象提供的方法来进行插入/删除/查询等操作.要创建HTable对象,首先要创建一个带有HBase集群信息的配置对象Confi ...