范例:checkbox多选
<div id="div1" style="width:850px;"></div>
<script language="javascript"> var config = { "id_field": "id", "chk_show": true, "chk_cascade_select_parent": true, "chk_cascade_select_children": true, "show_summary": true, "columns":[ {"title": "组织名称", "field": "orgName"}, {"title": "ID", "field": "id", "align": "center", "width": "30", fieldCal: true, calStyle: "min"}, {"title": "组织编号", "field": "orgCode", "align": "center", "width": "60"}, {"title": "描述", "field": "orgDesc", "align": "center", "width": "100"}, {"title": "操作人", "field": "operator", "align": "center", "width": "60"}, {"title": "总人数", "field": "count", "align": "center", "width": "60", fieldCal: true, calStyle: "sum"}, {"title": "薪水", "field": "salary", "align": "center", "width": "60", fieldCal: true, calStyle: "avg", digit: 2}, {"title": "查看", "handler": "customLook", "align": "center", "width": "120"} ], "dataset":[ {"id": 1,"orgName": "城区分公司", "orgCode": "CQ", "operator": "cjm", "count": 200, "salary": 3000.50, "children":[ {"id": 5,"orgName": "城区卡品分销中心", "count": 100, "salary": 2000.00}, {"id": 6,"orgName": "先锋服务厅", "count": 50, "salary": 1000.00, "children":[ {"id": 7,"orgName": "chlid1", "count": 30, "salary": 1000.00}, {"id": 8,"orgName": "chlid2", "count": 20, "salary": 900.00}, {"id": 9,"orgName": "chlid3", "count": 20, "salary": 800.00, "children": [ {"id": 10,"orgName": "chlid3-1", "count": 10, "salary": 500.00}, {"id": 11,"orgName": "chlid3-2", "count": 10, "salary": 500.00}, {"id": 12,"orgName": "chlid3-3", "count": 10, "salary": 500.00}, {"id": 13,"orgName": "chlid3-4", "count": 10, "salary": 500.00} ]} ]}, {"id": 14,"orgName": "半环服务厅", "count": 10, "salary": 500.00} ]}, {"id": 2,"orgName": "清新分公司", "orgCode": "QX", "operator": "", "count": 10, "salary": 500.00}, {"id": 3,"orgName": "英德分公司", "orgCode": "YD", "operator": "", "count": 10, "salary": 500.00}, {"id": 4,"orgName": "佛冈分公司", "orgCode": "FG", "operator": "", "count": 10, "salary": 500.00} ] }; var treeGrid = jQuery("#div1").showTreeGrid(config); function customLook(trid, ptrid, row, col){ return "<a href='javascript:void(0);' style='color:blue;'>查看</a> <a href='javascript:void(0);' style='color:blue;'>编辑</a> <a href='javascript:alert(0);' style='color:blue;'>删除</a>"; } </script>
相关推荐
在官网上下了个treegrid-dnd.js实现拖拽,发现并没有太多条件限制,自己修改了一下,限制只能拖拽到比自己高一级别的父节点中,希望大家有用
layui提供了一系列丰富的组件,其中“树表格”(TreeGrid)是结合了表格和树形结构的一种特殊展示形式,常用于数据层级关系的展示。本篇文章将深入探讨基于layui的树表格-treeGrid的实现原理、使用方法以及相关的...
"TreeGrid-1.0.zip"很可能是一个包含TreeGrid相关组件或库的压缩包,版本号为1.0,可能是某个开发者或团队发布的早期版本。 TreeGrid的基本概念: 1. **树形结构**:TreeGrid的基础是树形结构,每个节点可以有子...
Bootstrap Treegrid是一款基于Bootstrap框架和JavaScript的插件,用于在网页上展示数据为树形结构的表格。这个插件能够将传统的二维表格扩展为可折叠的树状结构,非常适合处理层次化数据,如组织结构、目录层级或者...
在"TreeGrid-1.1"中,我们看到了一个优化过的版本,旨在提供更好的用户体验,支持多种功能,包括子节点分页、列宽拖拽调整、勾选选择以及延迟加载。 1. **子节点分页**:在处理大量数据时,子节点分页是一种高效的...
在IT领域,Checkbox TreeGrid是一种常见的数据展示控件,它结合了树形结构和表格的特点,其中第一列通常包含复选框,用户可以通过选择复选框来操作或筛选树形结构中的节点。这个主题主要涉及前端开发,尤其是...
easyui+jquery,其他组件数据(这里用的是列表ul)往treegrid树形表格里拖放数据,形成新的树形表格数据,自行引入css和js就可运行
在IT领域,树形表格(TreeTable)是一种特殊的数据展示方式,它结合了表格和树状结构的优点,常用于组织层次分明、具有父子关系的数据。本文将深入探讨“树形表格treetable完整版”,包括它的特点、应用场景、二次...
在实际应用中,我们经常需要添加复选框(checkbox)功能,以便用户可以多选操作。本文将详细介绍如何在 jQuery Easyui Treegrid 中实现显示和管理复选框的功能。 首先,要实现 Treegrid 中的复选框功能,我们需要在...
@ agile-central-technical-services / utils-treegrid派生的列 此模块提供Rally.ui.grid.TreeGridView的替代,它增加了对derivedColumnCfgs配置的支持,该配置接受从模型数据“派生”但不是模型本身上的字段的列...
$(this).treegrid('enableDnd', row?row.id:null); //上面的代码是demo中的,但是对于要保存更改到数据库显然走不通,需要向其他办法 //启用拖动排序 //enableDnd($('#datagrid_depttree')); } 就行了
TreeGrid表格是一种在WPF(Windows Presentation Foundation)框架下实现的高级数据展示控件,它结合了树形结构和网格视图的特点,提供了一种既能够展现层次关系又可以进行行列布局的数据展示方式。这种控件在处理...
扩展jquery.treegrid.extension.js,实现jquery-treegrid的懒加载,结合jquery.cookie.js来实现缓存,减缓页面大量数据加载
- vue-multiselect:Vue.js插件,用于创建多选下拉列表。 - bootstrapTable.js:Bootstrap的扩展,用于生成交互式的表格。 - FancyTree的treeGrid:用于展示树形结构的表格。 2. 后端技术: - Mapper:实体与...
**正文** `jqGrid`是一款基于JavaScript的开源数据网格组件,主要用于在Web应用中展示和管理大量结构化数据。它提供了丰富的特性和功能,包括数据的分页、排序、过滤、编辑以及对服务器端数据的异步操作。...
- 通过treeGrid插件展示,此插件支持层次化的数据展示。 **菜单编辑页面中上级菜单数据的呈现方式:** - 通过zTree插件展示上级菜单,便于选择和编辑。 #### 三、部门模块 **部门模块的主要作用:** - 维护部门...
- **新组件**: 新增了多个实用组件,如TreeGrid、DataView等,进一步丰富了开发者的选择。 - **API改进**: API接口得到优化,使得开发者能够更加方便地调用和管理各种组件。 - **主题与样式**: 提供了更多主题和样式...
EASY-UI示例EASY-UI示例EASY-UI示例EASY-UI示例EASY-UI示例EASY-UI示例EASY-UI示例EASY-UI示例EASY-UI示例EASY-UI示例EASY-UI示例EASY-UI示例
- `maxazan-jquery-treegrid-447d662` 这个版本号可能是项目的一个特定提交ID,意味着你可以从源码仓库获取到这个特定版本的源代码,以确保使用的版本与描述一致。 - **版本更新**:随着时间的推移,开发者会发布新...
TreeGrid是一种将表格和树形结构结合的数据展示控件,常用于Java和JavaScript开发中,以提供更加灵活和丰富的数据展示方式。它允许用户在单个视图中查看层次结构数据,同时支持展开、折叠、排序和筛选等功能。在本...