Ext-grid-Panel
来源:互联网 发布:淘宝花呗还款有利息吗 编辑:程序博客网 时间:2024/04/30 11:05
Grids are an excellent way of showing large amounts of tabular data on the client side. Essentially a supercharged<table>
, GridPanel makes it easy to fetch, sort and filter large amounts of data.
Grids are composed of two main pieces - a Store full of data and a set of columns to render.
Grids 是一种优秀展示大量数据的表格在客户端。本质上是一种table,GridPanel能够简单的提取,排序和过滤大量的数据。
Girds有主要的两块构成,一个是存储数据,和呈现数据的列组成。
Basic GridPanel
Ext.create('Ext.data.Store', { storeId:'simpsonsStore', fields:['name', 'email', 'phone'], data:{'items':[ { 'name': 'Lisa', "email":"lisa@simpsons.com", "phone":"555-111-1224" }, { 'name': 'Bart', "email":"bart@simpsons.com", "phone":"555-222-1234" }, { 'name': 'Homer', "email":"home@simpsons.com", "phone":"555-222-1244" }, { 'name': 'Marge', "email":"marge@simpsons.com", "phone":"555-222-1254" } ]}, proxy: { type: 'memory', reader: { type: 'json', root: 'items' } }});Ext.create('Ext.grid.Panel', { title: 'Simpsons', store: Ext.data.StoreManager.lookup('simpsonsStore'), columns: [ { text: 'Name', dataIndex: 'name' }, { text: 'Email', dataIndex: 'email', flex: 1 }, { text: 'Phone', dataIndex: 'phone' } ], height: 200, width: 400, renderTo: Ext.getBody()});
The code above produces a simple grid with three columns. We specified a Store which will load JSON data inline. In most apps we would be placing the grid inside another container and wouldn't need to use the height, width and renderTo configurations but they are included here to make it easy to get up and running.
The grid we created above will contain a header bar with a title ('Simpsons'), a row of column headers directly underneath and finally the grid rows under the headers.
上面的代码生成一个简单的网格和三列。我们加载指定存储数据,数据来自于JSON。在大多数应用程序我们会将网格内另一个容器,不需要使用高度、宽度和renderTo配置但他们这里包括使它容易启动和运行。- Ext-grid-Panel
- Ext.grid.Panel使用
- Ext.grid.Panel
- Ext.grid.Panel综合示例
- Ext.grid.Panel 表头隐藏
- EXT数据展示(Ext.grid.Panel)
- 使用Ext.grid.Panel生成表格
- 使用Ext.grid.Panel显示远程数据
- 导出Ext.grid.Panel到excel
- Ext.grid.Panel加载JSON数据
- Ext.grid.Panel表格特性Feature
- Ext.grid.Panel中stateId的作用
- Ext.grid.Panel 正确显示日期
- Ext.grid.Panel 数据动态改变后刷新grid
- Extjs4的Ext.grid.Panel的行双击事件事件
- Ext JS中Ext.grid.Panel或Ext.data.Store中遮罩效果去除
- Grid panel
- Ext.Panel
- WowModelViewer和WowMapViewer编译
- Poj3308 Paratroopers(最小割)
- SSH的优缺点和原理
- office办公技巧相关知识
- 一分钟对我们的重要意义
- Ext-grid-Panel
- zencart怎么装插件
- QPainter类的使用
- 位图方法排序
- 记下 自己学习 tinyxml 的事情
- vs2010 使用STLport-5.2.1
- hdu 1503 DP
- Machine Learning(五—2)神经网络学习
- 高手们的播客