Ext.form.ComboBox: использовать шаблон для displayField

Есть ли способ применить шаблон к выбранному значению ComboBox? Я использую шаблон для отображения раскрывающихся значений ComboBox, но как только я выбираю один из них, отображается обычное значение из хранилища данных.

{
  id:               'requestStatusCombo',
  hiddenName:       'requestStatus',
  tpl:             '<tpl for="."><div class="x-combo-list-item">{statusCode:requestStatus}</div></tpl>',
  fieldLabel:       'Status',
  xtype:             'combo',
  mode:           'local',
  triggerAction:     'all',
  store:             new Ext.data.ArrayStore({
      fields:       ['statusCode'],
      data:       [['unassigned'],['assigned'],['closed']]
  }),
  valueField:       'statusCode',
  displayField: 'statusCode'
}

Я хочу использовать свою функцию формата requestStatus для перевода statusCodes в имена статусов, специфичные для локали, и это хорошо работает для раскрывающегося списка, но как только я что-то выбираю, отображается statusCode.

Итак, возможно ли назначить шаблон для displayField или, возможно, выполнить простую пакетную модификацию хранилища данных? Возможно, путем обработки ввода через считыватель? Есть ли другое ключевое слово <tpl for="?">, которое сделает это возможным?

Я ищу какой-нибудь простой метод, использующий библиотеку Ext. Если единственным решением является предварительная обработка данных, я могу сделать это сам.


person Ivar Bonsaksen    schedule 30.07.2010    source источник


Ответы (2)


Я нашел решение!

Я изменил свое хранилище данных и добавил считыватель для предварительной обработки состояния с помощью функции преобразования:

{
  id:               'requestStatusCombo',
  hiddenName:       'requestStatus',
  fieldLabel:       'Status',
  xtype:             'combo',
  mode:           'local',
  triggerAction:     'all',
  store:             new Ext.data.Store({
      data:       [['unassigned'],['assigned'],['closed']],
      reader:       new Ext.data.ArrayReader({},[
          {name: 'statusCode',   mapping: 0},
          {name: 'displayname', mapping: 0, convert: function(statusCode) {
              return Ext.util.Format.requestStatus(statusCode);
          }}
      ])
  }),
  valueField:       'statusCode',
  displayField:   'displayname'
}
person Ivar Bonsaksen    schedule 30.07.2010

Изучив сгенерированный DOM, вы заметите, что хотя элементы списка являются элементами DIV, само поле представляет собой элемент html INPUT. У вас не может быть HTML внутри элемента INPUT... так что нет... здесь нет xtemplate.

Это не означает, что это нельзя сделать, расширив Ext.form.ComboBox (или, возможно, Ext.Component)

person Mchl    schedule 30.07.2010