在使用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. css display:inline-block 出现空格解决方案

    一: 给父元素添加 display: table;(只加这一句在谷歌, safari里可以) 子元素加: display: table-cell(火狐) 两句都加完美解决 二: .nav ul{fon ...

  2. jenkins配置

    自动化测试机器172,27.14.22   IP 一.jenkins要先登录——>点击JCF_Automation——>点击左边配置 二.环境变量赋值就不会把进程杀掉

  3. jsp提交表单数据乱码,内置对象,以及过滤器

    jsp提交表单数据乱码解决方案 通过form表单给服务器提交数据的时候,如果提交的是中文数据,那么可能会出现乱码,如果表单的请求方式是post请求,那么可以使用如下方案解决乱码: 在调用getPara ...

  4. Three.js资源

    学习教程:http://www.hewebgl.com/ 例子:http://threejs.org/

  5. article和section

    article和section都是指页面中的块,但是article更加强调独立性,而section常被用来分块. section使用禁忌: 1.不要把section当作定义样式的容器,因为那是div的 ...

  6. 用VC调用EXCEL简单代码(转载自越长大越孤单,觉得很好)

    首先在stdafx.h里加入对IDispatch接口提供支持的头文件: #include <afxDisp.h> 再在应用程序类的InitInstance()函数里加入: AfxOleIn ...

  7. javaweb学习总结 servlet开发(一)

    转载:http://www.cnblogs.com/xdp-gacl/p/3760336.html 这里主要是将其加入自己的理解过一遍. 这里的代码全在eclipse java ee中执行的. 一.s ...

  8. SQL 事务

    /*========================事务==============================*/begin tran--开始事务 --开始写流程语句 --语句写完之后if @@ ...

  9. iOS 线性滚动

    在这里,给大家带来简单的滚动实现,首先看一下实现效果. 通过观察不难发现,有很多地方并不是那么容易想出来的,对于篇随笔,感兴趣可以查查相关资料,我就不尽行过多说明,(主要是开考文字,不好说明

  10. 页码条--字符串拼接--重写HtmlHelper

    public static HtmlString ShowPageNavigate(this HtmlHelper htmlHelper, int currentPage, int pageSize, ...