extjs怎么实现折叠表格

2024-11-03

ExtJs的expand和collapse

最近在研究ExtJs的窗口组件(Ext.window),关于扩展显示expand和折叠显示collapse的一点心得记录一下,以便后查. var win2 = new Ext.window({ id : "TestWin", panelLayout: 'fit', resizable: true, modal : false, collapsible :true, collapseDirection:'top', title : "TEST", innerItems

折叠表格思路及遇到的问题(tableView:viewForHeaderInSection:的section从1开始，不是从0开始)

项目需要做了一个类似qq联系人的折叠表格,思路很简单:设置每个section的header,在header上显示组名等信息,然后根据折叠与否,设置每个section中cell的数量,如果折叠,则将之设置为0,否则设置为实际的cell数量,然后刷新表格即可. 那么问题来了: 1.如果使用UITableViewStylePlain样式的表格,那么header是会在表格滑动的时候在顶部悬浮,而不是跟随表格的滑动而一起滑动. 2.如果使用了UITableViewStyleGrouped样式的表格,tab

css折叠表格

1.html <div class="custom-fold-table"> <table cellpadding="0" cellspacing="0" width="100%" class="ellipsis-thead custom-table last-column-center table-border"> <thead> <tr> <th w

深入浅出ExtJS 第三章表格控件

3.1 表格的特性简介 >.Ext中的表格功能:包括排序/缓存/拖动/隐藏某一列/自动显示行号/列汇总/单元格编辑等实用功能; >.表格由类Ext.grid.GridPanel定义,继承自Ext.Panel,其xtype为grid; >.表格控件必须包含列(columns)定义信息,并指定表格的数据存储器(Ext.data.Store); 3.2 制作一个简单的表格 >1.列的定义是一个JSON数组,它是整个表格的列模型,应该首先创建; var columns = [ {heade

ExtJS学习(三)Grid表格

表格说明 Ext中的表格功能非常强大,包括排序.缓存.拖动.隐藏某一列.自动显示行号.列汇总.单元格编辑等实用功能.表格由类Ext.grid.GridPanel定义,继承自Ext.Panel,其xtype为grid.在EXT中,表格控件必须包含列定义信息,并指定表格的数据存储器.表格数据最起码有列.数据.转换原始数据这3项.列信息由数组columns定义,表格的数据存储器由Ext.data.Store来定义.store负责把各种各样(如二维数组.JSON对象数组.XML文本等)的原始数据转换成E

ExtJS中实现嵌套表格

先看效果: 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;

sencha/extjs 动态创建grid表格

//创建普通表格 id,父容器,标题,json数据字符串,列名(逗号分隔),json数据key即store的fields属性(逗号分隔) function createCommonTable(id, container, fieldLabel, value, columns,dataIndexs) { if(typeof(container)!="object") { container=Ext.getCmp(container); //根据id取组件 } var rarr = col

[ExtJS5学习笔记]第三十三节 sencha extjs 5 grid表格导出excel

使用extjs肯定少不了使用表格控件,用到表格,领导们(一般)还是惯于使用excel看数据,所以用到extjs表格的技术猿们肯定也会有导出表格excel这一个需求,本文主要针对如何在用extjs将grid表格导出到excel,使用的是前端导出,不涉及后端. 源代码打包下载将源代码嵌入到应用中查看导出按钮以及导出效果扩展支持sum统计和groupsum分组源代码打包下载本次使用的是github上的一个开源项目Exporter 下载地址:https://github.com/iwiznia

初学ExtJs 表格显示后台数据

最近开始接触ExtJs,贴出自己的代码,一个简单的表格显示版本 3.4.1 需要json包代码清单1.jsp引入的ExtJs文件  <link href="ExtJs/resources/css/ext-all.css" type="text/css" rel="stylesheet"/> <script type="text/javascript" sr

asp.net之treeview无法显示树结点图标（IP与域名的表现竟不一样）

背景今天接到客户的电话,说部署上去的项目树型的treeview无法正常显示,显示成了好几个大红叉.如: 排查于是我通过远程登录到服务器,在本地测试了一会发现没有这个问题存在,无论是通过IP地址.localhost或是127.0.0.1,treeview的图标都是可以正常访问的. 后来尝试了用域名的形式访问,就发现treeview的图标无法显示,而是以无法找到资源的大红叉代替. 在这里,就出现了这样的问题:在服务器部署成功,测试没问题时,通过域名的映射竟然会有所不同? 于是

Ext 常用组件解析

Ext 常用组件解析 Panel 定义&常用属性 //1.使用initComponent Ext.define('MySecurity.view.resource.ResourcePanel', { extend: 'Ext.panel.Panel', requires:[ 'MySecurity.view.resource.ResourceGrid' ], xtype: 'resourcePanel', //是否显示边框 border:true, padding:'0 5', //折叠模式 c

[ExtJS5学习笔记]第三十六节报表组件mzPivotGrid

mzPivotGrid 是一个报表组件,采用这个组件之后,可以令你的应用体现更多的价值. 什么是pivot grid 什么是mzPivotGrid 学习资源与图表组件的融合什么是pivot grid extjs的面板panel对于展示大批量数据来说是pefect的,并且还提供了各种各样的展示方式.但是唯一缺少一个pivot grid,当需要做数据报表的时候,pivot grid就起作用了. 什么是mzPivotGrid mzPivotGrid是可以在extjs中使用的表格报表组件,你只需要引

每天CSS学习之border-collapse

border-collapse是CSS2的一个属性,其作用是折叠表格(table)的边框.collapse翻译过来又折叠的意思. border-collapse有三个值: collapse:将表格和单元格的边框折叠: separate:分隔表格和单元格的边框,这是默认值: inherit:从父元素继承该属性. 实践一下: 1.分隔表格和单元格的边框,这是默认的: table,th,td{ border:1px solid black; } .myTable{ border-collapse:se

JAVAEE——SSH项目实战06：统计信息管理、Spring注解开发和EasyUI

作者: kent鹏转载请注明出处: http://www.cnblogs.com/xieyupeng/p/7190925.html 一.统计信息管理二.Spring注解开发 1.service为例子 @Service("customerService") @Transactional(isolation=Isolation.REPEATABLE_READ,propagation=Propagation.REQUIRED,readOnly=false) public class

使用FlexiGrid实现Extjs表格的效果-网络传输小，更方便！

近一段时间Extjs真的是风光无限好,只要是个做CRM/HRM之类的企业现在都在琢磨怎么在项目中用它,不过兄弟我可是不敢,原因很简单:太大/太笨/源码不好调试.但是对于Extjs漂亮的表格与功能的强大,实在是让我垂涎三尺,记得以前有个老外同志写过一个类似的Extjs的Jquery插件,所以就在Jquery的插件海洋中一顿海找,呵呵,还真让我找到了.看来还是我的Jquery好,小巧简单好像一部好的汽车引擎,我想要什么就可以自已DIY,真是方便. 总体方案在网络传输上不超过80KB,速度比500

SSRS 实用技巧 ---- 为表格添加展开/折叠操作（明细报表）

相信很多人都会遇到这样的需求:当表格按照某几个列分组时,需要为组添加展开和折叠的操作. 最初展现表格的时候只展现最外层分组,然后点击展开后可以查看分组内的明细情况. 先来一张效果图,然后再看具体如何实现: 话不多说,我们来看看这个功能如何实现. 首先创建示例表 CREATE TABLE [dbo].[DetailReportTestData] ( ) NULL, ) NULL, ) NULL, [Value1] [int] NULL, [Value2] [int] NULL ) 然后造点数据插进

jQuery treetable【表格多重折叠树功能及拖放表格子元素重新排列】

今天有个表格需求做到多重折叠子元素功能,仔细想了下实现原理, 1.在html中,把父子节点的关系写在自定义属性,但对于节点是否有孩子(hasChild),是否是最后一个节点(isLastOne),是否是第一个节点(isFirstOne),都还不知道.所以第一步要分析出这些信息,把这些信息都记录到自定义属性.2.先扫描所有的tr,构造出两个map,分别记录{'pId' => ['id1', 'id2']}和{id => pId}的关系.3.再次扫描所有的tr,根据两个map的关系,给tr增加h

[jquery]折叠指定条件的表格

最近在做财务报表时候,一些表格要做特定折叠效果这里通过2个自定义属性来对表格之间的属性作关联 date-head和date-num,输出表格时候,可以按照这2个自定义属性给某些带父子层级关系的内容指定关联关系再通过jquery获取这些具有相当关联关系的表格作出折叠效果效果图先上jquery $(document).ready(function(e) { $(".table").find(".head").each(function() { $(this).f

easyui 折叠数据表格使用

因为要用到折叠数据表格但是官网上的例子不能展示费了好大劲走了很多弯路现在能显示出数据以前大多都是看别人写的文章自己解决问题的时候几乎没记录过现在想想真不是好习惯特此记录分享出来有需要的朋友可以参考我用的是.net MVC 首先在视图层中创建表格 $('#IntentionsList').datagrid({ loadMsg: "正在加载数据", url: '@Url.Action("GetList",

FineUI大版本升级，外置ExtJS库、去AXD化、表格合计行、表格可编辑单元格的增删改、顶部菜单框架

这是一篇很长的文章,在开始正文之前,请允许我代表目前排名前 20 中唯一的 .Net 开源软件 FineUI 拉下选票: 投票地址: https://code.csdn.net/2013OSSurvey/gitop/codevote/vote_num 目前排名前 20 的,只有 FineUI 是 .Net 项目,也希望大家能够多多支持这唯一的 .Net 项目!!!!! ======================== --> FineUI v3.3.0 更新的内容非常多,所以一下子从 v3.2.

Extjs 表格横坐标显示问题

在项目中显示chart时,当横坐标的标签名称过长时,extjs会自动隐藏部分的标签. 我想,如果能让标签斜着,或者纵向显示的话,就能够节省x轴上的长度. 经过在网上查找,解决方案如下. //在表格的axes中添加 label项 axes: [ { ....\\y轴 }, { type: 'Category', position: 'bottom', fields: ['name'], label: { rotate: { degrees: 315} }, title: 'x轴' } ] //la

extjs怎么实现折叠表格

热门专题