自己封装的Extjs组件GroupGrid（1）

最新推荐文章于 2018-04-25 15:37:40 发布
原创 最新推荐文章于 2018-04-25 15:37:40 发布 · 269 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了一种能够自动生成包括查询、导出、统计等功能的表格界面解决方案，支持多表头、记录分组显示及自带右键菜单等特性。

 效果图（1）: 能自动生成 按显示字段查询,高级查询,导出数据,统计图, 改变每页记录数

自己封装的Extjs组件GroupGrid.js（1） - chy2z - 黑暗行动

 效果图（2）: 能够使用插件，多表头插件

自己封装的Extjs组件GroupGrid.js（1） - chy2z - 黑暗行动

效果图（3）:  记录分组显示，高级查询界面自己封装的Extjs组件GroupGrid.js（1） - chy2z - 黑暗行动

效果图（4）:能够自动生成 增加和修改界面 

自己封装的Extjs组件GroupGrid.js（1） - chy2z - 黑暗行动

效果图（5）:生成简单的统计图

自己封装的Extjs组件GroupGrid.js（1） - chy2z - 黑暗行动

 效果图（6）:自带右键菜单

自己封装的Extjs组件GroupGrid.js（1） - chy2z - 黑暗行动

 GroupGrid 用到了后面日志中介绍的几个组件，有兴趣的可以看看后面几个组件的代码！最后在把GroupGrid 的代码放上来！

代码下载地址：http://www.51aspx.com/code/ChyBookMS

[Ext JS]5.8 Group Grid-分组网格
oscar999的专栏
05-17 662
分组网格及其效果 分组Grid， 是以数据中的某一个属性对数据进行分组， 以上图为例， 对三国的武将列表以国家进行分组。 分组Grid的效果是： 每个分组会新增一行组的显示 该分组的属性一般不需要以列进行显示 分组网格的实现 Ext JS 原生就提供了分组网格的实现， 实现方式是通过Grid的features 进行配置。以上面的示例效果为例， 代码片段如下： xtype:'grid', columns: [{text: '武将名',dataIndex: 'name',fl
ExtJs7.X grid filter remote 后台java条件封装注解
sword_happy的博客
10-24 543
由ExtJs7.X grid使用filter插件进行remote过滤的时候，传递了不少filter条件参数，本文基于参数进行解析，并封装为注解。
extjs_GroupPropertyGrid.js
11-20
基于extjs分组propertyGrid ,分组不排序
【引用】自己封装的Extjs组件GroupGrid（1）
随风飘絮
02-28 1130
和大家分享这篇日志，我的看法是：  原文地址：自己封装的Extjs组件GroupGri    原文作者：chy2z  效果图（1）: 能自动生成 按显示字段查询,高级查询,导出数据,统计图, 改变每页记录数  效果图（2）: 能够使用插件，多表头插件 效果图（3）:  记录分组显示，高级查询界面 效果图（4）:能够自动生成 增加和修改界面  效果图（5）:生成简单的统计图
extjs jsonreader groupgrid
程序人生
12-17 1082
http://defafe.com/tutorial-extjs-grouping/ 检查JSON的合法性http://www.jslint.com/
extjs4.2后台系统（菜单、下拉树组件封装）
最新发布
06-08
ExtJS 4.2后台系统的菜单和下拉树组件封装是一个涉及前端架构、组件设计、用户交互、性能优化以及测试等多个方面的复杂过程。通过对这些组件的合理封装，可以大大提高后台系统的开发效率和用户体验。
eEcology-ExtJS:eEcology 项目中应用的共享 ExtJS 组件
06-30
eEcology 项目中应用程序的共享 ExtJS 组件。 要求 SenchaCmd，从下载并安装。 karma，为了运行测试，使用sudo apt-get install nodejs lcov和sudo npm install -g karma-cli 。 业力插件， cd packages/datetime/...
ExtJS 组件扩展
08-17
为了更好地适应特定业务需求，ExtJS支持自定义组件的扩展与封装。本文将重点探讨ExtJS中组件扩展的两种主要层次及其实践要点。 #### 二、常见错误及原因分析 在使用ExtJS进行组件扩展时，开发人员常常会遇到一些...
extjs 3.1 组件 使用
05-28
在本篇文章中，我们将深入探讨如何在实际项目中使用ExtJS 3.1的组件。 首先，`css`目录包含了ExtJS 3.1的样式文件。这些CSS文件用于定义组件的外观和布局，包括颜色、字体、边距、边框等。在使用过程中，我们需要...
自己封装的Extjs组件GroupGrid的代码（2） GroupGrid.js
chy2z的专栏
04-25 355
接着上《一篇自己封装的Extjs组件GroupGrid的代码（1）  GroupGrid.js》 剩余GroupGrid.js代码： createChartWindow:function(){                  var date=new Date().format("Y-m-d H:i:s");                                     
ext4采用最新的MVC模式groupgrid 分组表
04-15
从项目中提取的代码 绝对可以正常运行 采用的是ext最新的mvc模式 有必要的注释，ext版本为4.1.1（如果直接运行的话文件夹的名称需要更改一下）
自己封装的Extjs组件GroupGrid的代码（1） GroupGrid.js
chy2z的专栏
04-25 349
由于代码空格太多，一篇发不完分成两段发上来。 GroupGrid.js 代码段（1） Ext.namespace("Ext.tet");Ext.tet.GroupGrid=Ext.extend(Ext.grid.GridPanel , {                //=====================================自定义属性结束===========
extjs4.1 grid 分组 （对象是一个object）以及其它。
zhengyuechuan的专栏
09-13 4340
前几天做分组，老是遇到问题，后来经过测试，找到了解决方法。 model中： Ext.define('Sharera.model.community.Topic', { extend: 'Ext.data.Model', idProperty: 'id', fields: [ {name:'id',type:'long'}, {nam
ExtJS4.2学习(10)分组表格控件--GroupingGrid
weixin_33758863的博客
12-11 266
分组表格控件在我们的开发中经常被用到，GroupingGrid分组表格就是在普通表格的基础上，根据某一列的数据显示表格中的数据分组的表格控件。举个例子给大家，比如某些信息用树形显示觉得有点大才小用，树形可以有无限极，但是用了分组表格可以完美的展示信息，看下图是我的项目中用到的一个例子，将所有评分项显示出来，并且动态获取是否有次数，如果有次数将出现可编辑，没有次数就不可编辑，如...
extjs---分组表格groupGrid
热门推荐
snn1410的专栏
04-11 1万+
Ext.grid.GroupingGrid分组表格就是在普通表格的基础上，根据某一列的数据将表格中的数据分组显示的表格的控件。  var cm = [      {header:'编号',dataIndex:'id',name:'id'},     {header:'性别',dataIndex:'sex',name:'sex'},     {header:'名称',dataIndex:'n
extjs grid grouping 关闭和展开
weixin_34106122的博客
07-04 350
Ext.onReady(function() { var store = Ext.create('Ext.data.Store', { storeId: 'employeeStore', fields: ['name', 'seniority', 'department'], groupField: 'department', da...
ExtJS4学习笔记十－－Grid使用
逸雨涵梦的专栏
08-21 5329
一、grid的例：  Javascript代码   //配置表格列   {header: "姓名", width: 50, dataIndex: 'name'},   {header: "组长", width: 50, dataIndex: 'leader',        xtype: 'booleancolumn',//Ext.grid.column.Bool
Extjs 表格分组 grid grouping
jazywoo_在路上
08-23 1805
Ext.onReady(function(){ Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget='side'; var itemsPerPage=10; var store1=Ext.create('Ext.data.Store',{ storeId:'gridStore1', fields:['Id
extjs_05_grid(表格分组)
那些疯狂到以为自己能够改变世界的人，才能真正改变世界！
06-24 1780
extjs_05_grid(表格分组)
ExtJs组件实例快速导入Eclipse教程
1. **ExtJs框架介绍**： ExtJs是由Sencha公司开发的一个用于构建前端的JavaScript框架。它使用并扩展了jQuery库，并且提供了丰富的用户界面组件。ExtJs框架广泛应用于构建富互联网应用(RIA)，这些应用通常拥有类似...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值