treeGrid

Ext.onReady(function() {
var data1 = [{
"_id" : 1,
"_parent" : null,
"_level" : 1,
"_is_leaf" : false,
"item" : "主营业务成本",
"YN" : 64.72,
"price":2541
}, {
"_id" : 2,
"_parent" : 1,
"_level" : 2,
"_is_leaf" : true,
"item" : "网络维护成本",
"YN" : 64.72,
"price":874
}, {
"_id" : 3,
"_parent" : 1,
"_level" : 2,
"_is_leaf" : true,
"item" : "资源成本",
"YN" : 64.72,
"price":874
}
, {
"_id" : 4,
"_parent" : null,
"_level" : 1,
"_is_leaf" : true,
"item" : "网络维护成本",
"YN" : 64.72,
"price":874
}];
var record = Ext.data.Record.create([{
name : '_id',
type : 'int'
}, {
name : '_level',
type : 'int'
}, {
name : '_is_leaf',
type : 'bool'
},
{
name : '_parent',
type : 'string'
},
{
name : 'item'
}, {
name : 'price',
type : 'float'
}, {
name : 'change',
type : 'float'
}, {
name : 'pct_change',
type : 'float'
}, {
name : 'last_change',
type : 'date',
dateFormat : 'n/j h:ia'
}, {
name : 'YN',
type : 'float'
}]);
var store = new Ext.ux.maximgb.tg.AdjacencyListStore({
  autoLoad : true,
reader : new Ext.data.JsonReader({
id : '_id'
}, record),
proxy : new Ext.data.MemoryProxy(data1)
});
// store.on("load",function(e){
//　　store.expandAll();
//});

var grid = new Ext.ux.maximgb.tg.GridPanel({
height : 300,
renderTo : 'a',
store : store,
master_column_id : 'item',
columns : [{
id : 'item',
header : "科目",
Expanded :false,
width : 160,
sortable : true,
dataIndex : 'item'
}, {
header : "Price",
width : 75,
sortable : true,
renderer : 'usMoney',
dataIndex : 'price'
}, {
header : "Change",
width : 75,
sortable : true,
renderer : change,
dataIndex : 'change'
}, {
header : "% Change",
width : 75,
sortable : true,
renderer : pctChange,
dataIndex : 'pct_change'
}, {
header : "Last Updated",
width : 85,
sortable : true,
renderer : Ext.util.Format
.dateRenderer('m/d/Y'),
dataIndex : 'last_change'
}],
stripeRows :true,
  autoExpandColumn : 'item',
title : '知识库',
listeners : {
rowclick : function(g, r, e) {
alert(r);
}
},
bbar : new Ext.ux.maximgb.tg.PagingToolbar({
store : store,
displayInfo : true,
pageSize : 10
})
});
function change(val) {
if (val > 0) {
val = '<span style="color:green;">' + val + '</span>';
} else if (val < 0) {
val = '<span style="color:red;">' + val + '</span>';
}
return val;
}

// example of custom renderer function
function pctChange(val) {
if (val > 0) {
val = '<span style="color:green;">' + val + '%</span>';
} else if (val < 0) {
val = '<span style="color:red;">' + val + '%</span>';
}
return val;
}

});