Ext多層ヘッダーツリーテーブル
参照
ColumnHeaderGroupを導入する必要がある.css、ColumnHeaderGroup.js
ColumnHeaderGroupを導入する必要がある.css、ColumnHeaderGroup.js
var continentGroupRow=[
{ header:'',align: 'center',colspan: 4},
{header:'VaR95%',align:'center',colspan:2},
{header:'VaR97%',align:'center',colspan:2},
{header:'VaR99%',align:'center',colspan:2}
];
var columns=[
{id:'pname',header: " ", width:150, sortable: false, dataIndex: 'pname'},
{header: " ", sortable: true, dataIndex: 'portname'},
{header: " ", sortable: true, dataIndex: 'absolute1'},
{header: " ", sortable: true, dataIndex: 'absolute2'},
{header: " ", sortable: true, dataIndex: 'price'},
{header: " ", sortable: true, dataIndex: 'absolute3'},
{header: " ", sortable: true, dataIndex: 'price'},
{header: " ", sortable: true, dataIndex: 'absolute3'},
{header: " ", sortable: true, dataIndex: 'price'},
{header: " ", sortable: true, dataIndex: 'absolute3'}
];
var fields=[
{name: 'pname'},
{name: 'portname'},
{name: 'price'},
{name: 'absolute1'},
{name: 'absolute2'},
{name: 'absolute3'},
{name:'_parent'},
{name: '_id'},
{name: '_level', type: 'int'},
{name: '_lft', type: 'int'},
{name: '_rgt', type: 'int'},
{name: '_is_leaf', type: 'bool'}
];
var group = new Ext.ux.grid.ColumnHeaderGroup({
rows: [continentGroupRow]
});
var record = Ext.data.Record.create(fields);
var store = new Ext.ux.maximgb.treegrid.NestedSetStore({
autoLoad : true,
reader: new Ext.data.JsonReader({id: '_id'}, record),
proxy: new Ext.data.MemoryProxy()
});
var grid = new Ext.ux.maximgb.treegrid.GridPanel({
store: store,
master_column_id : 'pname',
height: 340,
id:'pgrid',
iconCls: 'icon-grid',
collapsible: true,
animCollapse: false,
columns:columns,
stripeRows: true,
autoExpandColumn: 'uname',
title: ' ',
viewConfig : {
forceFit: true
},
plugins: group,
renderTo:'grid1'
});