首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

ext学习_GridPanel(七)

2013-10-29 
ext学习_GridPanel(7)1.GridPanelExtJS 中的表功能非常强大,包括了排序、缓存、拖动、隐藏某一列、自动显示行

ext学习_GridPanel(7)

1.GridPanel

ExtJS 中的表格功能非常强大,包括了排序、缓存、拖动、隐藏某一列、自动显示行号、列汇总、单元格编辑等实用功能。

表格由类Ext.grid.GridPanel 定义,继承自Panel,其xtype 为grid。ExtJS 中,表格Grid必须包含列定义信息, 并指定表格的数据存储器Store 。表格的列信息由类

Ext.grid.ColumnModel 定义、而表格的数据存储器由Ext.data.Store 定义,数据存储器根据解析的数据不同分为JsonStore、SimpleStroe、GroupingStore 等。

(1)、简单的表格的使用:

function showUrl(value){return "<a href='http://"+value+"' target='_blank'>"+value+"</a>";}Ext.onReady(function(){var store=new Ext.data.Store({url:"aa.xml",reader:new Ext.data.XmlReader({record:"row"},["id","name","organization","homepage"])});var colM=new Ext.grid.ColumnModel([{header:"项目名称",dataIndex:"name",sortable:true},{header:"开发团队",dataIndex:"organization",sortable:true},{header:"网址",dataIndex:"homepage",renderer:showUrl}]);var grid = new Ext.grid.GridPanel({renderTo:"hello",title:"中国Java开源产品及团队",height:200,width:600,cm:colM,store:store,autoExpandColumn:2});store.load();});






热点排行