Extグリッドグループヘッダに別のフィールドの値を表示する方法は？

Question

私はExt.grid.Panelを持っていますが、フィールドでグループ化したいのですが、グループ化ヘッダーには別のフィールドを表示したいと思います。たとえば、モデルにstatus_idとstatus_nameのフィールドがある場合は、status_idでグループ化しますが、グループヘッダーにはstatus_nameと表示されます。

私はgroupHeaderTplオプションで遊んできましたが、これまでのところ運がありませんでした。これはどうすればできますか？

Answer 1

あなたがすべてのかのう値を観察し、あなたが探している値を取得するために正しいパスを選択することができますこの方法

groupHeaderTpl:'{[console.log(values)]}' 

を行うことによってgrouperHeaderTpl値をデバッグすることができます。この場合、あなたは何をする必要があるか、私は私がデータにそのようにアクセスしてはならないと思ったのにここでは、

/* Sample Data */ 
var data = [ 
     { "status_id": 1, "status_name": "Pending"}, 
     { "status_id": 2, "status_name": "Ready"}, 
     { "status_id": 3, "status_name": "Processing"}, 
     { "status_id": 4, "status_name": "Unavailable"}, 
     { "status_id": 5, "status_name": "Ready"}, 
     ]; 

/* Model */ 
Ext.define("StatusModel", { 
    extend: 'Ext.data.Model', 
    fields: ['status_id', 'status_name'] 
}); 

/* Store */ 
Ext.create('Ext.data.Store', { 
storeId:'statusStore', 
model: "StatusModel", 
groupField: 'status_id', 
data: data, 
proxy: { 
    type: 'memory', 
    reader: { 
     type: 'json' 
    } 
} 
}); 

/* Grouping Feature */ 
var groupingFeature = Ext.create('Ext.grid.feature.Grouping',{ 
    groupHeaderTpl: '{[values.rows[0].data.status_name]}' 
}); 

/* Grid Panel */ 
Ext.create('Ext.grid.Panel', { 
title: 'Status', 
store: Ext.getStore('statusStore'), 
columns: [ 
    { text: 'Id',  dataIndex: 'status_id' }, 
    { text: 'Name', dataIndex: 'status_name', flex: 1} 
], 
features: [groupingFeature], 
renderTo: Ext.getBody() 
}); 

http://jsfiddle.net/alexrom7/shZLf/1/