extjs html css,html - Extjs ComboBox - Change the CSS? - Stack Overflow

it's not possible using CSS alone but you can use XTemplates to do something similar.

I've done it like this:

Ext.onReady(function(){

var states = Ext.create('Ext.data.Store', {

fields: ['class', 'desc', 'policy', 'ac'],

data : [

{"class":"1", "desc":"Medical Bills", "policy":"41000", "ac":"1"},

{"class":"12", "desc":"One Time Payments", "policy":"41000", "ac":"1"},

{"class":"3", "desc":"Treatment", "policy":"41000", "ac":"1"}

]

});

// Create the combo box, attached to the states data store

Ext.create('Ext.form.ComboBox', {

fieldLabel: 'Class Description',

width: 400,

store: states,

queryMode: 'local',

valueField: 'class',

displayField: 'desc',

renderTo: Ext.getBody(),

listConfig: {

minWidth: 500,

tpl: new Ext.XTemplate(

'

Class

' +

'

Description

' +

'

Policy

'+

'

A/C

' +

'

• ' +

'

' +

'

{class}

' +

'

{desc}

' +

'

{policy}

' +

'

{ac}

' +

'

'

)

}

});

});

Really, it should be done using an actual table but it seems (From what I've tried anyway) that the ComboBox needs the ul/li tags in order to work correctly.

If you want to see it in action, here's a JS Fiddle: http://jsfiddle.net/MzdqJ/3/

It doesn't look to great but that should just be a case of playing around with the CSS styles. The logic should work at least.