分享好友 最新动态首页 最新动态分类 切换频道
extjs 配置与表格使用
2024-12-26 22:19

引用 :http://www.jb51.net/article/20027.htm

http://wenku.baidu.com/view/226ce70cba1aa8114431d9bf.html

中文网站:http://extjs.org.cn/download

extjs看你使用的版本,ext有4个版本,extjs1,extjs2,是完全不要钱的,extjs3用于商业用途是要交钱的按使用的人算

2.0.2版本http://extjs.org.cn/node/3

 

 

ExtJS是一套完整的RIA解决方案,也因为功能完整造成了ext-all.js有400多k,由于是基于JS和CSS的功能实现,对客户端机器性能也有一定的要求,即不支持IE6以下的版本。如果您的项目对网页响应时间有严格的限制,或者客户端操作系统过于陈旧,一定不要选择ExtJS。 
本文主要是介绍ExtJS的下载和配置以及一些简单的使用方法。目前最新版本为3.0,但是本文主要介绍2.2版本。 
一、ExtJS下载以及配置 
1、下载地址:www.extjs.com/(这是官网,大家可以选择自己喜欢的版本下载) 
2、配置过程,假设下载后的目录为Ext,我们在该目录下建立我们自己的目录MyExample(该目录用于存放你自己写的代码),配置过程如下: 
(1) 新建一个页面文件Helloworld.html 
(2) 在<head>和</head>之间添加如下代码: 


(3) 这里注意<script></script>不能用</script>取代 
(4) js的导入顺序不要更改 
(3) 如果弹出一个HelloWorld的对话框,则代表配置成功。 
二、表格控件Grid的使用 
EXT中的表格功能非常强大,包括排序、缓存、拖动、隐藏某一列、自动显示行号、列汇总、单元格编辑等使用功能。我们首先介绍如何制作一个简单的Grid。 
1、创建表格的列信息: 


2、添加数据信息: 


3、创建数据存储对象: 


4、表格的列模型定义好了,原始数据和数据的转换也已经完成,剩下的只需要把它们装配在一起,我们的Grid就创建成功了。 


5、注意:Ext.grid.Grid的renderTo属性指示EXT将表格渲染到什么地方,所以,在HTML里应该有一个<div id='grid'></div>与之对应。 
6、所有代码清单如下(已通过测试): 


3、我们也可以考虑autoExpandColumn,它可以让指定列的宽度自动伸展,从而填充整个表格。代码如下 


注意:autoExpandColum只能指定一列的id,注意,必须是id,原来我们设置的cm里面都没有id,现在为了使用autoExpandColumn,要给cm的desn设置id.于是在渲染时desn就可以自动延伸,否则会出错。 


3.3 让Grid支持按列排序 
在EXT中可以很方便地实现排序功能,只需要在定义列模型时增加sortable属性,如下面代码所示: 


2、接着我们在reader里面增加一行配置,除了设置name以外,还设置了type和dateFormat两个属性。代码如下: 


3、同样的,我们还需要在cm里面增加一行配置: 


4、代码详细信息如下所示,效果图如图4所示。 

3.6 表格分页 
Grid控件对性能要求较高,如果在一个Grid里面显示上千条记录,效率会有明显下降,所以必须考虑分页问题。 
1、为Grid添加分页工具条:在前面代码的基础上修改grid代码: 


2、定义grid,注意此时是EditorGridPanel. 


2、创建表格的列信息 


3、创建数据存储对象 


4、设计分组设计表格 


5、代码清单如下,效果图如图9所示。

 

图9 分组表格

首先我们看图10的效果图:

图10 可拖放的表格

注意图10四周的蓝色细条,把鼠标放到上面,就可以用拖放改变表格的高度和宽度,实现这一效果并不难,也不需要对写好的Grid做大的修改,只要在原先的基础上添加如下代码:


注意: 
(1) Resizable必须放在render之后,否则就会出现问题; 
(2) handles:'all'代表可以向所有放心拖动表格 
七、Grid与右键菜单 
Grid提供了四个与右键菜单相关的事件: 
(1) contextmenu:全局性的右键事件; 
(2)cellcontextmenu:单元格上的右键事件 
(3)rowcontextmenu:行上的右键事件 
(4)headercontextmenu:表头的右键事件 
以下代码我们实现一个行上的右键事件,代码清单如下,效果图如11所示 

 

 

最新文章
rank 开窗函数_Oracle 的开窗函数 rank,dense_rank,row_number
1、开窗函数和分组函数的区别分组函数是指按照某列或者某些列分组后进行某种计算,比如计数,求和等聚合函数进行计算。开窗函数是指基于某列或某些列让数据有序,数据行数和原始数据数相同,依然能曾现个体数据的
入库案例选介|提供非法爬虫软件行为的刑法规制
提供非法爬虫软件行为的刑法规制最高人民法院四级调研员黎鹏江苏省无锡市梁溪区人民法院2009年刑法修正案(七)增设提供侵入、非法控制计算机信息系统程序、工具罪,进一步严密保护计算机信息系统和数据安全的刑事法网。实践中,关于“专门
济南SEO网站优化,提升网站排名,助力企业腾飞,济南SEO优化专家,助力企业网站排名飞跃
济南SEO专业网站优化服务,致力于提升企业网站排名,助力企业快速在搜索引擎中脱颖而出,增强 *** 竞争力,实现互联网营销目标,助力企业腾飞。2、降低营销成本:相较于其他 *** 营销手段,SEO优化具有成本较低、效果显著的特点,通过优化
淘宝人群推广和货品运营区别是什么?作者:小果 时间:2024-12-16 阅读:4533
淘宝运营策略:人群推广与货品运营的深度解析在淘宝这个竞争激烈的电商平台上,运营策略的选择至关重要。其中,人群推广和货品运营是两种常见的运营方式,它们各自具有独特的优势和适用场景。下面,我们将对这两种运营方式进行详细解析,并
磁力在线搜索引擎蜘蛛
搜索引擎是我日常工作中用得最多的一款工具,国内常用的搜索引擎包括Baidu,sougou,bing等。但我本篇要纪录的并不是这些常用的搜索引擎,而是信息安全从业人员必备的几款网络搜索引擎。本篇要介绍的搜索引擎包括:Shodan,censys,钟馗之
纯干货开发一个小程序需要多少钱?不同公司的报价差别太大,看完就懂了
各位迈友大家好~小迈迈又来跟大家叨叨了。一直以来,迈象网都十分重视用户的反馈,最近我们也根据用户的呼声来说说,开发一个小程序需要多少钱。纯干货和网上搜索的都不一样 ,看完这个要是不明白 ,你找我免费给你做个小程序。1.小程序三
百度地域性多个关键词排名的小技巧
重点导读:做SEO还是有比较大的操作空间的,不是SEO流量不好做,而是我们没有打开获取更多流量的方式。在优化地域性的朋友,可以试试本文说到的这个简单技巧。 百度地域性是很重要的,如果我们能够在做SEO的时候做好规划,就能获得大量精准
私域营销:解锁品牌增长新引擎
  在数字化营销日新月异的今天,私域营销作为品牌与消费者深度连接的重要策略,正逐渐成为市场营销领域的一大热点。私域营销,简而言之,就是通过建立和管理品牌自有的、直接面向消费者的沟通渠道,实现用户数据的积累、分析与应用,从而
免费漫画阅站app1.1.99版下载
字如其名,漫画免费看。《免费漫画阅站 1.1.99版》是一款非常可以尽情畅看漫画的神器,在免费漫画阅站软件内。海量的漫画资源,各种类型的漫画,绝对能够满足你的漫画阅读需求。在免费漫画阅站软件内,高清的漫画资源,更有个性化的推送功
速腾 carplay 点击无反应是怎么回事
仪表盘一直亮不灭可能有多种原因。一是牵引力控制系统TCS出现故障。二是车辆引擎灯、电池灯常亮这可能表示车辆电子系统有问题或者发动机异常需检查故障代码并维修。三是机油灯、刹车灯、轮胎压力灯等提醒灯常亮要及时处理。
相关文章
推荐文章
发表评论
0评