extjs grid列数动态可变

var gridStore = new Ext.data.Store({
                    id: 
'gridStore',
                    proxy: 
new Ext.data.HttpProxy({ url: 'http://www.cnblogs.com/HR/Pay/PayAjax/PayRollAjax.ashx?model=GetGridStore&year=' + year + "&month=" + month + "&TypeId=" + TypeId }),
                    reader: 
new Ext.data.JsonReader({
                        root: 
'data'
                    })
                });
                
var CmStore = new Ext.data.Store({
                    proxy: 
new Ext.data.HttpProxy({ url: 'http://www.cnblogs.com/HR/Pay/PayAjax/PayRollAjax.ashx?model=GetCMJson&TypeId=' + TypeId }),
                    reader: 
new Ext.data.JsonReader({
                        root: 
'data'
                    })
                });
                CmStore.load({
                    callback: 
function() {
                        
var cmArray = [];
                        
var sm = new Ext.grid.CheckboxSelectionModel();
                        cmArray.push(
new Ext.grid.RowNumberer());
                        cmArray.push(sm);
                        CmStore.each(
function(r) {
                            
var columns = null;
                            
if (r.data.StrFiledName == "empId") {
                                columns 
= { header: r.data.StrName,  70, sortable: true, dataIndex: r.data.StrFiledName, renderer: function(data, cell, r, rowIndex, columnIndex, store) {
                                    cell.attr 
= "style=background-color:#f3e2d7";
                                    
return GetSyncData("http://www.cnblogs.com/HR/Pay/PayAjax/PayRollAjax.ashx?model=GetName&empId=" + data);
                                }
                                }

                            }
                            
else if (r.data.IsShow == true) {
                                columns 
= { header: r.data.StrName,  85, sortable: true, dataIndex: r.data.StrFiledName, renderer: function(data, cell, r, rowIndex, columnIndex, store) {
                                    cell.attr 
= "style=background-color:#f3e2d7";
                                    
return (data == null ? "0" : data);

                                }
                                }
                            } 
else {
                                
if (IsCheckOut == "1") {
                                    columns 
= { header: r.data.StrName,  85, sortable: true, dataIndex: r.data.StrFiledName, renderer: function(data, cell, r, rowIndex, columnIndex, store) {
                                        cell.attr 
= "style=background-color:#f3e2d7";
                                        
return (data == null ? "0" : data);

                                    }
                                    }
                                } 
else {
                                    columns 
= { header: r.data.StrName,  70, sortable: true, dataIndex: r.data.StrFiledName,
                                        editor: 
new Ext.form.NumberField({
                                            style: 
'text-align:left'
                                        }), renderer: 
function(value) {
                                            
return "<font color=red><b>" + (value == null ? "0" : value) + "</b></font>";
                                        }
                                    }
                                }
                            }
                            cmArray.push(columns);
                        });
                        
var cm = new Ext.grid.ColumnModel(cmArray);
                        
var grid = new Ext.grid.EditorGridPanel({
                            id: 
'grid',
                            store: gridStore,
                            sm: sm,
                            cm: cm,
                            clicksToEdit: 
1,
                            title: year 
+ "" + month + "" + "=>" + GetSyncData("http://www.cnblogs.com/HR/Pay/PayAjax/PayRollAjax.ashx?model=GetTypeName&TypeId=" + TypeId) + "=>工资表",
                            region: 
'center',
                            loadMask: 
true,
                            stripeRows: 
true,
                            autoScroll: 
true,
                            border: 
false,
                            stateful: 
true,
                            trackMouseOver: 
true,
                            autoShow: 
true,
                            viewConfig: {
                                forceFit: 
false
                            },
                            listeners: {
                                
"afteredit"function(e) {
                                    
var r = e.record; //得到当前行所有数据
                                    var f = e.field; //得到修改列
                                    var v = e.value; //得到修改列修改后值
                                    if (v == "") {
                                        grid.getStore().reload();
                                        
return
                                    }
                                    
//通过ajax请求修改数据
                                    Ext.Ajax.request({
                                        url: 
"http://www.cnblogs.com/HR/Pay/PayAjax/PayRollAjax.ashx?model=UpdateMoney",
                                        method: 
"POST",
                                        params: {
                                            FieldName: f,
                                            UpdataValue: v,
                                            Id: r.data.ID,
                                            TypeID: TypeId
                                        },
                                        success: 
function(r) {
                                            grid.getStore().reload();
                                        },
                                        failure: 
function() {
                                            MessageBox(
"提示""操作失败!", Ext.MessageBox.ERROR);
                                            grid.getStore().reload();
                                        }
                                    });



                                }
                            }
                        });
CmStore 从另一个数据源(一列的表格, 存放各列名字, 可在后台创建个datatable, json输出去前台)读取列名
原文地址:https://www.cnblogs.com/barrysgy/p/2040884.html