Ext grid 动态表头的例子

Question

如题，因为表头可能要从数据库查出来。所以求动态表头的例子~

Answer 1

给你个参考吧:
[code="js"]
Ext.onReady(function(){
//header也就是你应该从后台取回的表头数据,现在写死在了这里
var headers = [{name: 'company',header:'Company'},{name: 'price',header:'Price'},{name: 'change',header:'change'}]
var store = new Ext.data.SimpleStore({
fields: headers
});
var columns = [];
Ext.each(headers,function(h){
columns.push({
header:h.header,
dataIndex:h.name
});
});

var grid = new Ext.grid.GridPanel({
    store: store,
    columns: columns,
    stripeRows: true,
    height:350,
    width:600,
    title:'Array Grid'
});

grid.render('grid');

});
[/code]

上面从后台取表头的时候应该用同步方法调用后台,而不是用异步,如果用异步的话,会出现你还没拿到后台的表头数据就实例化了grid.
给你个同步请求的方法:
[code="js"]
var syncRequest = function(url) {
var conn = Ext.lib.Ajax.getConnectionObject().conn;
try {
conn.open("GET", url, false);
conn.send(null);
} catch (e) {
Ext.Msg.alert('info','error');
return false;
}
return Ext.decode(conn.responseText);
}
//把上面的headers改为
var headers = syncRequest(url);
后台的返回数据为headers的内容就行啦
[/code]