ExtJS: Передать имя группы в сгруппированном комбинированном списке tpl динамически - PullRequest
Новая
       14

ExtJS: Передать имя группы в сгруппированном комбинированном списке tpl динамически

0 голосов
/ 30 мая 2019

Я работаю над списком групп, где мне нужно передать имя группы динамически (из его конфигурации). 

  var data = [{
           group: 'Fubar',
           key: '1',
           name: '2015 Product Development'
       }, {
           group: 'Fubar',
           key: '2',
           name: 'Message Filter'
       }, {
           group: 'Fubar',
           key: '3',
           name: '2014 Product Development (Little)'
       }, {
           group: 'Other',
           key: '4',
           name: 'Global Structure'
       }, {
           group: 'Other',
           key: '5',
           name: 'My SW'
       }];
    Ext.apply(combo, {
            listConfig: {
        tpl = new Ext.create('Ext.XTemplate',
               '<tpl for=".">',
               '<tpl for="group" if="this.shouldShowHeader(group)"><div class="group-header">{[this.showHeader(values.group)]}</div></tpl>',
               '<div class="x-boundlist-item"><input type="checkbox" />{name}</div>',
               '</tpl>', {
                   shouldShowHeader: function(group) {
                       return this.currentGroup !== group;
                   },
                   showHeader: function(group) {
                       this.currentGroup = group;
                       return group;
                   }
               });
}
});
var combo = Ext.create('Ext.data.Store', {
       fields: ['group', 'key', 'name'],
       data: data
   });
 items: [{
           xtype: 'combobox',
           id: 'searchInput',
           store: combo,
           multiSelect: true,
           labelWidth: 50,
           queryMode: 'local',
           displayField: 'name',
           fieldLabel: 'Choose',
           listConfig: {
               cls: 'grouped-list'
           },
           tpl: tpl,
groupName: 'group'
}]

Я пытался с кодом, но не работает. Это дает group, собственное свойство вместо его значения. 

<tpl for="combo.groupName" if="this.shouldShowHeader(combo.groupName)">
  • Здесь в качестве комбо используется экземпляр комбобокса.

1 Ответ

0 голосов
/ 03 июня 2019

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

  '<tpl for=".">',
    '<tpl for="' + combo.groupName + '" if="this.shouldShowHeader(' + combo.groupName + ')"><div class="group-header">{[this.showHeader(values.' + combo.groupName + ')]}</div></tpl>',
    '<div class="x-boundlist-item"><input type="checkbox" />{name}</div>',
  '</tpl>'
...