如何构建动态的Grid的列

存在这样的需求,即如果显示的Grid的列是通过配置获取的,如何实现?
关键点:
加载配置的列数据
var store = new Ext.data.JsonStore({
                autoDestroy:true,
                fields     : ['mainTaskColumnConfig'],
                url: 'getUserDefineCols_columnConfig.do'
            });

            store.on('load', function(st, records) {
               this.grid = new MyGrid({columnConfig:records[0].data.mainTaskColumnConfig});
            }, this)

            store.load();

对应的JSON数据:
[{"mainTaskColumnConfig":[{"align":"center","dataIndex":"taskName","header":"任务名称","hidden":false,"sortable":true,"width":100},{"align":"center","dataIndex":"priority","header":"优先级","hidden":false,"sortable":true,"width":100},{"align":"center","dataIndex":"proposeSystem","header":"提交系统","hidden":false,"sortable":true,"width":100},{"align":"center","dataIndex":"executeMode","header":"任务执行模式","hidden":false,"sortable":true,"width":100},{"align":"center","dataIndex":"taskType","header":"任务类型","hidden":false,"sortable":true,"width":100},{"align":"center","dataIndex":"groupName","header":"组名","hidden":false,"sortable":true,"width":80},{"align":"center","dataIndex":"progress","header":"进度","hidden":false,"sortable":true,"width":100},{"align":"center","dataIndex":"proposeInterfaceType","header":"提交接口类型","hidden":false,"sortable":true,"width":100},{"align":"center","dataIndex":"taskHint","header":"任务描述","hidden":false,"sortable":true,"width":60},{"align":"center","dataIndex":"proposer","header":"提交者","hidden":false,"sortable":true,"width":100}]}]

自扩展的MyGrid的定义:
...
 this.cm = new Ext.grid.ColumnModel([
            new Ext.grid.RowNumberer()
            ]);

    var defaultLength = this.cm.config.length;
    for(i = 0 ; i < columnConfig.length ;i++){
   if (columnConfig[i].dataIndex === 'executeMode') {//add render
            columnConfig[i].renderer = someRenderFn;
        }
      this.cm.config[defaultLength + i] =  columnConfig[i];
    }
    this.cm.setConfig(this.cm.config);
...

你可能感兴趣的:(json,ext)