sdbrk
2014-05-05 16:38:03
Extjs动态生成表头
var cm = [{ header : "编号", dataIndex : "id", width : 65 }, { header : "名称", dataIndex : "name", width : 65 }, { header : "路径", dataIndex : "url", width : 65 }] var colModel = new Ext.grid.ColumnModel({ columns : cm }); var fd = ["id", "name", "url"]; var store = new Ext.data.JsonStore({ fields : fd }) var grid = new Ext.grid.GridPanel({ cm : colModel, store : store, tbar : [{ xtype : "combo", id : 'my_combo', triggerAction : "all", store : ["新增列","更换列"], mode : 'local', resizable : true, editable: false, lazyRender : true, width : 100 },"-",{ text : "生成", icon : "images/icons/add.png", cls : "x-btn-text-icon", handler : function() { var temp = Ext.getCmp('my_combo').getValue(); if(temp == null || temp == "") return; var newfd=""; var newcm=""; if(temp == "新增列"){//在原有列的基础上追加新的列 newfd = fd; newcm = cm; var res = {//要添加的列信息,可以动态获取 fields : [{ name : "sex" }], columns : [{ header : '性别', dataIndex : "sex", width : 65 }] }; var fields = res.fields; var columns = res.columns; for (var i = 0; i < fields.length; i++) {//自己可以写控制不重复追加 newfd.push(fields[i]); newcm.push(columns[i]); } }else if(temp == "更换列"){//更换表格中所有的列 var res = {//要更换的列信息,可以动态获取 fields : ["number", "age", "address"], columns : [{ header : '号码', dataIndex : "number", width : 80 },{ header : '年龄', dataIndex : "age", width : 80 },{ header : '地址', dataIndex : "address", width : 80 }] }; newfd = res.fields; newcm = res.columns; } // 重新绑定store及column newStore = new Ext.data.JsonStore({ fields : newfd }); var newColumnModel = new Ext.grid.ColumnModel(newcm); grid.reconfigure(newStore , newColumnModel);//使用新的Store和ColumnModel并刷新 //列变动之后,就可以做数据的加载了,加载的就是对应新的列的数据了。 } }] }) var myWin = new Ext.Window({ title:"动态改变ColumnModel", width : '600', height : 500, frame : true, layout : 'fit', items : [grid] }); myWin.show();
由最代码官方编辑于2016-6-26 9:46:17
猜你喜欢
请下载代码后再发表评论
相关代码
最近下载
最近浏览
chongminzheng LV1
7月13日
msstat LV5
2023年11月9日
fellowfun LV12
2023年4月28日
1358849392 LV21
2022年11月11日
fy0088 LV2
2022年9月25日
ttttt111
2022年6月24日
暂无贡献等级
zhuchengqi
2022年4月18日
暂无贡献等级
微信网友_5862509096882176 LV1
2022年3月7日
白墨雪Hiya
2021年12月15日
暂无贡献等级
45436683 LV8
2021年11月19日