是用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，只要传入不同的初始化参数就可以了。