ExtJs 之GridPanel实例

<div id="grid-div"></div>
<script>
Ext.onReady(function(){
var cm = new Ext.grid.ColumnModel([
//设置好表的列头
{header:'编号',dataIndex:'id',sortable:true}, //{首部显示文本,列对应的记录集字段,列是否排序(sortable)}
{header:'名称',dataIndex:'name'},
{header:'描述',dataIndex:'descn'}
]) ;
var data = [
['1','张三','descn1'],
['2','李四','descn2'],
['3','王五','descn3'],
['4','赵六','descn4'],
['5','孙奇','descn5']
] ;
var ds = new Ext.data.Store({
proxy:new Ext.data.MemoryProxy(data),//获取数据的方式   (用Ext.data.MemoryProxy专门解析JavaScript变量)
reader:new Ext.data.ArrayReader({},[  //如何解析这堆数据
{name: 'id'},
{name: 'name'},
{name: 'descn'}
])
}) ;//远程读取数据使用ScriptTagProxy  如要从本地读取数据  需要将MemoryProxy改成PagingMemoryProxy
ds.load() ;//加载数据
var grid = new Ext.grid.GridPanel({
el:'grid-div',
ds: ds, //ds可以把任何格式的数据转化成grid可以使用的形式
cm: cm,
width:305,
height:133
}) ;
grid.render() ;
}) ;

</script>