extJs 5 - группировка нескольких уровней сетки

Я ищу способ группировать данные по месяцам и месяцам по годам ... два уровня группировки. На данный момент я могу сгруппировать свои данные только годами ...extJs 5 - группировка нескольких уровней сетки

Может ли кто-нибудь мне помочь?

Моя модель:

Ext.define('User', { 
extend: 'Ext.data.Model', 
fields: [ 
// 'name', 
// 'email', 
'phone' ]});

Мои данные:

var userStore = Ext.create('Ext.data.Store', { 
model: 'User', 
data: [ 
    { year: '2015', month : 'march', phone: '555-111-1224' }, 
    { year: '2015', month : 'april', phone: '555-222-1234' }, 
    { year: '2014', month : 'march', phone: '555-222-1244' }, 
    { year: '2014', month : 'april', phone: '555-222-1254' } 
], 
groupField: 'year'});

Сетка:

Ext.application({ 

name : 'MyApp', 

launch : function() { 

    Ext.create('Ext.grid.Panel', { 
     renderTo: Ext.getBody(), 
     features: [{ ftype: 'grouping' }], 
     store: userStore, 
     width: 250, 
     height: 300, 
     title: 'Application Users', 
     columns: [ 
      { 
       text: 'Phone Number', 
       flex: 1, 
       dataIndex: 'phone', 
       sortable: false, 
       hideable: false 
      } 
     ] 
    }); 
}});

Thx заранее! Mayes

источник

2015-03-07 mayes

Итак, вы хотите, чтобы пользователь мог расширить список лет, а затем расширить список за несколько месяцев до просмотра соответствующих номеров? Похоже, вы хотите [TreePanel] (http://docs.sencha.com/extjs/5.1/5.1.0-apidocs/#!/api/Ext.tree.Panel), а не сгруппированную сетку. – Emissary

Да, это так ... но я хочу сделать это, используя панель сетки вместо панели дерева, но кажется, что я не могу это сделать, используя extJS 5 – mayes

TreePanel может иметь столбцы. Он будет отображаться точно так же, как и сетка, но будет иметь вложенные группы, которые вам нужны. Попробуйте найти пример сетки блокировки: http://dev.sencha.com/extjs/5.1.0/examples/tree/locking-treegrid.html. Возможно, вам не нужна функция блокировки столбцов, но в противном случае этот пример, похоже, является тем, что вы ищете. –

В магазине попробуйте использовать конфигурацию grouper вместо группового поля. Это даст вам больше гибкости в том, как вы группируете свои данные.

Вот пример для сценария:

var userStore = Ext.create('Ext.data.Store', { 
    model: 'User', 
    data: [ 
     { year: '2015', month : 'march', phone: '555-111-1224' }, 
     { year: '2015', month : 'april', phone: '555-222-1234' }, 
     { year: '2014', month : 'march', phone: '555-222-1244' }, 
     { year: '2014', month : 'april', phone: '555-222-1254' } 
    ],  
    grouper: { 
     groupFn: function(item) { 
      return 'Month: ' + item.get('month') + ', Year: ' + item.get('year'); 
     } 
    } 
);

Пожалуйста, смотрите https://fiddle.sencha.com/#fiddle/jh9, чтобы увидеть его в действии.

источник

2015-03-12 15:16:39

extJs 5 - группировка нескольких уровней сетки

ответ

Смежные вопросы