$('#listTree').treegrid({
idField: 'id',
treeField: 'menuName',
columns: [[ { title: 'Task Name', field: 'menuName', width: 180 },
{ field: 'menuUrl', title: 'progress', width: 60, align: 'right' } ]] });
var data = { "total": 3, "rows": [{ "id": 0, "menuName": "管理员首页", "menuUrl": "/main/admin/index.action", "menuPCode": -1, "isLeaf": "0", "status": "1", "icon": "", "createUser": "system", "createDate": "2014-01-24 17:10:25", "modifyUser": "system", "modifyDate": "2014-01-24 17:10:25" }, { "id": 1, "menuName": "修改密码", "menuUrl": "/main/admin/modifyPwd.action", "menuPCode": 0, "isLeaf": "1", "status": "1", "icon": "", "createUser": "system", "createDate": "2014-01-24 17:10:25", "modifyUser": "system", "modifyDate": "2014-01-24 17:10:25", "_parentId": 0 }, { "id": 2, "menuName": "图片上传", "menuUrl": "/image/admin/uploadImage.action", "menuPCode": 1, "isLeaf": "1", "status": "1", "icon": "", "createUser": "system", "createDate": "2014-01-24 17:10:25", "modifyUser": "system", "modifyDate": "2014-01-24 17:10:25", "_parentId": 1 }], "footer": [{ "name": "Total Persons:", "persons": 7, "iconCls": "icon-sum" }] };
$("#listTree").treegrid('loadData', data); $('#list').datagrid({
width: 1000,
height: 500,
columns: [[ { title: 'Task Name', field: 'menuName', width: 180 },
{ field: 'menuUrl', title: 'menuUrl', width: 60, align: 'right' } ]] });
var data = { "total": 3, "rows": [{ "id": 0, "menuName": "管理员首页", "menuUrl": "/main/admin/index.action", "menuPCode": -1, "isLeaf": "0", "status": "1", "icon": "", "createUser": "system", "createDate": "2014-01-24 17:10:25", "modifyUser": "system", "modifyDate": "2014-01-24 17:10:25" }, { "id": 1, "menuName": "修改密码", "menuUrl": "/main/admin/modifyPwd.action", "menuPCode": 0, "isLeaf": "1", "status": "1", "icon": "", "createUser": "system", "createDate": "2014-01-24 17:10:25", "modifyUser": "system", "modifyDate": "2014-01-24 17:10:25", "_parentId": 0 }, { "id": 2, "menuName": "图片上传", "menuUrl": "/image/admin/uploadImage.action", "menuPCode": 1, "isLeaf": "1", "status": "1", "icon": "", "createUser": "system", "createDate": "2014-01-24 17:10:25", "modifyUser": "system", "modifyDate": "2014-01-24 17:10:25", "_parentId": 1 }], "footer": [{ "name": "Total Persons:", "persons": 7, "iconCls": "icon-sum" }] };
$("#list").datagrid('loadData', data);

需要注意的是:data的数据,不是json字符串,是json对象

easyui的datagrid和treegrid的使用的更多相关文章

  1. [Easyui - Grid]为easyui的datagrid、treegrid增加表头菜单,用于显示或隐藏列

    为easyui的datagrid.treegrid增加表头菜单,用于显示或隐藏列 /** * @author 孙宇 * * @requires jQuery,EasyUI * * 为datagrid. ...

  2. RDIFramework.NET框架Web中datagrid与treegrid控件自动生成右键菜单与列标题右键菜单

    在实际应用中常可以看到数据展示控件有右键菜单的功能,对应的列标题也可以右键弹出快捷菜单设置指定列的显示与隐藏等功能.在我们的RDIFramework.NET Web框架中,只要是使用了EasyUI的D ...

  3. easyUI 中datagrid 返回列隐藏方法

    easyui的datagrid方法返回的列,有的值不需要显示可以使用hidden(属性进行隐藏) columns : [ [{ field : 'bailClass', title : '类别', w ...

  4. EasyUI 中 DataGrid 控件 列 如何绑定对象中的属性

    EasyUI 中 DataGrid 控件 是我们经常用到的控件之一, 但是 DataGrid 控件 在绑定显示列时却不支持对象属性绑定. 模型如下: public class Manager impl ...

  5. easyui的datagrid行的某一列添加链接

    通过formatter方法给easyui 的datagrid 每行增加操作链接. 效果图 jsp代码: <th field="url" width="100&quo ...

  6. easyui的datagrid打印(转)

    在使用easyui插件的时候,使用最多的应该是datagrid插件.有时候根据客户需求,可能需要将datagrid内容进行打印,这时候如果直接调用window.print,可能由于easyui的dat ...

  7. EasyUI的datagrid分页

    EasyUI的datagrid分页 前台代码: <script type="text/javascript"> $(function () { //查询 search( ...

  8. easyui使用datagrid时列名包含特殊字符导致表头与数据错位的问题

    做一个用easyui的datagrid显示数据的功能时发现表格的列头与数据错位了,而且这个现象不总是能重现,一直没搞清楚原因.后来偶然在控制台看出了一点端倪: 推测表头或者单元格的class名应该是用 ...

  9. 利用Aspose.Cells完成easyUI中DataGrid数据的Excel导出功能

    我准备在项目中实现该功能之前,google发现大部分代码都是利用一般处理程序HttpHandler实现的服务器端数据的Excel导出,但是这样存在的问题是ashx读取的数据一般都是数据库中视图的数据, ...

随机推荐

  1. bootstrap panel如何实现可拖动并排序

    Draggable Panels Bootstrap test  如果是使用bootstrap的panel请严重注意class = row 与class = col-....等的嵌套,要不然排序会出问 ...

  2. C#为什么要多线程开发(一)

    首先说下多线程出现的原因: 为了解决负载均衡问题,充分利用CPU资源.为了提高CPU的使用率,采用多线程的方式去同时完成几件事情而不互相干扰.为了处理大量的IO操作时或处理的情况需要花费大量的时间等等 ...

  3. atom那些事儿

    基于electron(Electron 的底层基于Chromium 和node.js)

  4. VMware6.0-vCenter的安装准备及安装

    由于6.0的VCSA安装需要跳板主机来辅助,而在5.5时时可用用OVA导入模式安装的. 首先安装跳板插件 安装完成后,点击setup链接. 设置 Single Sign-On (SSO),将root和 ...

  5. 英语口语练习系列-C28-海滨-辨别身份-悬崖边的树

    beach 海滨 brown hut near body of water green trees near sea during daytime photography 海滨度假胜地 beach [ ...

  6. Java中的位运算符

    Java提供的位运算符有:左移( << ).右移( >> ) .无符号右移( >>> ) .位与( & ) .位或( | ).位非( ~ ).位异或( ...

  7. 【整理】Java 9新特性总结

    距Java 8正式发布三年多时间,Java 9 于2017年9月21日正式发布, 你可能已经听说过 Java 9 的模块系统(讨论的最多的),但是这个新版本还有许多其它的更新. 这里我整理了Java ...

  8. 面试题fugui

    1.什么是栈溢出,在什么情况下可能会出现 栈溢出是由于C语言系列没有内置检查机制来确保复制到缓冲区的数据不得大于缓冲区的大小,因此当数据足够大时,将会溢出缓冲区的范围. python函数调用是通过栈这 ...

  9. Flask蓝图

    它的作用就是将 功能 与 主服务 分开怎么理解呢? 比如说,你有一个客户管理系统,最开始的时候,只有一个查看客户列表的功能,后来你又加入了一个添加客户的功能(add_user)模块, 然后又加入了一个 ...

  10. JS_高程5.引用类型(4)Array类型的各类方法

    一.转换方法 所有的对象都具有toLocaleString(),toString()和valueOf()方法.调用toString()方法会返回由数组中的每个值的字符串拼接而成的一个以逗号分隔的字符串 ...