【转】ExtJs Grid自动生成列

这个问题纠结了我很久,本来想找个插件来解决的,但好像很少拿Extjs做报表啊,这么常用的功能竟然没有好的解决办法,唯一找到的一个插件就是AutoGrid2,可并不能解决问题,最后在老外的一段代码下终于找到了解决方法,原来如此简单.

数据源:'/Scripts/11.js'   也可以是aspx、jsp页面或者servlet

1: {'data':[{'number':'1','text1': '3','info1': '4','special1': '5'},{'number':'1','text1': '3','info1': '4','special1': '5'}],

2: 'columModle':[

3: {'header': '序号','dataIndex': 'number','width':40},

4: {'header': '编码','dataIndex': 'text1'},

5: {'header': '名称','dataIndex': 'info1'},

6: {'header': '金额','dataIndex': 'special1'}

7: ],

8: 'fieldsNames':[{name: 'number'},{name: 'text1'}, {name: 'info1'},{name: 'special1'}]

9: }

 

1: Ext.onReady(function() {

2:  

3: var conn = new Ext.data.Connection();

4: conn.request({ url: '/Scripts/11.js', callback: function(options, success, response) {

5: var json = new Ext.util.JSON.decode(response.responseText);

6: var cm = new Ext.grid.ColumnModel(json.columModle);

7: var ds = new Ext.data.JsonStore({

8: data: json.data,

9: fields:json.fieldsNames

10: });

11: var grid = new Ext.grid.GridPanel({

12: height: 200,

13: width: 400,

14: region: 'center',

15: split: true,

16: border: false,

17: store: ds,

18: cm: cm

19: });

20:  

21: grid.render('grid-example');

22: }

23: });

 

-------------------------------------------------

 

以参看下：
var cmItems = [];
var cmConfig = {};
cmItems.push(new Ext.grid.RowNumberer());
cmItems.push(sm);
cmItems.push({header : 'id',dataIndex : 'id',hidden : true,sortable : true});
cmItems.push({header : '单据编号',dataIndex : 'no',sortable : true});
cmItems.push({header : '组织',dataIndex : 'orgName',sortable : true});
cmItems.push({header : '上报日期',dataIndex : 'reportDate',sortable : true});
var priceTypeList = results.root
for(var i=0;i<priceTypeList.length;i++){
     cmConfig = {header : priceTypeList[i].priceType,dataIndex : 'priceType'+priceTypeList[i].id,width : 100,sortable : true}
     cmItems.push(cmConfig);
}
cmItems.push({header : ' 备注',dataIndex : 'note',width : 150,sortable : true});
cmItems.push({header : '创建人',dataIndex : 'createUserName',sortable : true});
cmItems.push({header : '创建日期',dataIndex : 'createDate',width : 120,sortable : true});
cmItems.push({header : '修改人',dataIndex : 'updateUserName',sortable : true});
cmItems.push({header : '修改日期',dataIndex : 'updateDate',width : 120,sortable : true});
cmItems.push({header : '状态',dataIndex : 'state',sortable : true});
// 信息列
var cm = new Ext.grid.ColumnModel(cmItems);