ExtJS, combo, listbox, text-align

Question

Не могли бы вы помочь выровнять по правому краю записи в списке со списком ExtJS? Конфигурация 'style' не работает с выравниванием текста или я делаю что-то неправильно?

См пример кодирования или скрипка Пример here

Ext.application({ 
name : 'Fiddle', 

launch : function() { 
    Ext.create('Ext.form.Panel', { 
     bodyPadding: 10, 
     defaultType: 'textfield', 
     fieldDefaults: { 
      labelAlign: 'right', 
      labelWidth: 150 
     }, 
     renderTo: Ext.getBody(), 
     standardSubmit: true, 
     title: 'Form', 
     width: 400, 
     items: [{ 
      displayField: 'val1', 
      fieldLabel: 'Combo', 
      name: 'field01', 
      queryMode: 'local',   
      store: Ext.create('Ext.data.Store', { 
       fields: ['key1', 'val1'], 
       style: 'text-align: right', // doesn't work 
       data: [ 
        {"key1":"AL", "val1":"Alabama..."}, 
        {"key1":"AK", "val1":"Alaska"}, 
        {"key1":"AZ", "val1":"Arizona"} 
       ] 
      }), 
      valueField: 'key1', 
      xtype: 'combo' 
     }] 
    }); 
} 

});

Answer 1

попробовать с этим .. он работает отлично на моем конце.

CSS

.alignRight .x-boundlist-item{ 
          text-align: right; 

        } 

добавить выше класс CSS для нашего комбо, используя listConfig .Вы можете увидеть то же самое в коде.

 displayField: 'val1', 
      fieldLabel: 'Combo', 
      name: 'field01', 
      queryMode: 'local', 
      listConfig:{ 
       cls:'alignRight', 
      }, 
      store: Ext.create('Ext.data.Store', { 
       fields: ['key1', 'val1'], 
       data: [ 
        {"key1":"AL", "val1":"Alabama..."}, 
        {"key1":"AK", "val1":"Alaska"}, 
        {"key1":"AZ", "val1":"Arizona"} 
       ] 
      }), 
      valueField: 'key1', 
      xtype: 'combo' 

Answer 2

Непосредственно выберите класс списка combobox в css и примените стиль, который он должен переопределить для любого стиля ExtJS.

Это будет работать:

.x-combo-list-item { 
    text-align: right; 
}