是用Ext.grid的初始化步骤总结

自己东拼西凑试着用了一下Ext的grid,感觉不错，现在有空总结了一下使用Ext.grid的步骤：
1、初始化Proxy参数

js 代码

 

var proxyParam={           url:'http://localhost:8080/demo2/login/index',           method"'GET'       };  

2、初始化JsonReader Meta参数

js 代码

 

var jsonReaderMeta={           root: 'items',           totalProperty: 'totalCount',           id: 'id'       };  

3、初始化JsonReader RecordType参数

js 代码

 

var recordType=[               {name: 'title', mapping: 'title'},               {name: 'author', mapping: 'author'},               {name: 'totalPosts', mapping: 'totalPosts', type: 'int'},               {name: 'lastPost', mapping: 'lastPost'},               {name: 'postText', mapping: 'post_text'}          ];  

4、初始化Grid ColumnModel参数

js 代码

var columnModel=[{              id: 'topic',  
           header: "Topic",              dataIndex: 'title',              width: 490,              renderer: renderTopic,              css: 'white-space:normal;'           },{              header: "Author",              dataIndex: 'author',              width: 100,              hidden: true           },{              id: 'last',              header: "Last Post",              dataIndex: 'lastPost',              width: 150,              renderer: renderLast           }];  

5、初始化Data Store

js 代码

var ds = new Ext.data.Store({           proxy: new Ext.data.HttpProxy(proxyParam),           reader: new Ext.data.JsonReader(jsonReaderMeta,recordType),           remoteSort: true       });  

6、初始化ColumnModel

js 代码

var cm = new Ext.grid.ColumnModel(columnModel);  

7、终于该grid出场了

js 代码

var grid = new Ext.grid.Grid('topic-grid', {           ds: ds,           cm: cm,           selModel: new Ext.grid.RowSelectionModel({singleSelect:true}),           enableColLock:false,           loadMask: true       });  

从上面的过程来看，可以显示对grid的封装，同一类功能的界面可以有一个函数来构建一个grid，只要传入不同的初始化参数就可以了。