Как показать другое значение поля в заголовке группировки сетки Ext?

У меня есть Ext.grid.Panel, который я хотел бы сгруппировать по полю, но отображать другое поле в заголовке группировки. Например, если в моей модели есть поля status_id и status_name, я бы хотел сгруппировать по status_id, но показать status_name в заголовке группы.

Я играл с опцией groupHeaderTpl, но пока безуспешно. Как это может быть сделано?


javascript grid grouping extjs extjs4
person XåpplI'-I0llwlg'I -    schedule 09.02.2013    source источник

Ответы (1)


arrow_upward
18
arrow_downward

Вы можете отладить значения grouperHeaderTpl, выполнив

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

Таким образом, вы сможете просмотреть все возможные значения и выбрать правильный путь для получения искомого значения. В этом случае, что вам нужно сделать, это

groupHeaderTpl: '{[values.rows[0].data.status_name]}'

Здесь вы можете найти весь пример

/* 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/

person alexrom7    schedule 11.02.2013
comment
Хорошее решение, хотя я думал, что не должен таким образом получать доступ к данным. - person code4jhon; 22.11.2013