-
17 Sep 2012 11:58 PM #1
Unanswered: Combobox listConfig selectedItemCls
Unanswered: Combobox listConfig selectedItemCls
Hi,
setting:
listConfig : { selectedItemCls: 'my-item-selected-class'
},
in ComboBox configuration doesn't work. Css class remain 'x-boundlist-selected'.
Why?
-
18 Sep 2012 1:34 AM #2Sencha - Community Support Team
- Join Date
- May 2012
- Location
- Istanbul
- Posts
- 1,331
- Vote Rating
- 76
- Answers
- 124
HI!
which version are you using of ExtJs 4?
also, you may check the API, default is x-item-selected not the boundlist-selected as mentioned by you...
http://docs.sencha.com/ext-js/4-1/#!...view.BoundListsword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.
-
18 Sep 2012 3:53 AM #3
Hi sword-it,
I'm using ExtJs 4.0.1 but the problem is the same for 4.1.1.
Api documentation for Ext.view.BoundList said:
selectedItemCls : String2
A CSS class to apply to each selected item in the view.
Defaults to: Ext.baseCSSPrefix + 'item-selected'
Available since: Ext 4
but in the Ext.view.BoundList (view source):
.
.
.initComponent:function(){
var me = this, baseCls = me.baseCls, itemCls = me.itemCls; me.selectedItemCls = baseCls + '-selected';where baseCls:Ext.baseCSSPrefix +'boundlist',Infact my 'combobox' render:<ul>
<li class="x-boundlist-item x-boundlist-selected" role="option" id="ext-gen1153">iPhone</li>
<li id="ext-gen1152" class="x-boundlist-item" role="option">Home</li>
<li id="ext-gen1151" class="x-boundlist-item" role="option">Cell</li>
<li id="ext-gen1150" class="x-boundlist-item" role="option">Office</li>
</ul>
The problem is that other configuration works, like:listConfig: {
loadingHeight: 70,
minWidth: 70,
maxHeight: 300,
shadow: 'false',
selectedItemCls: Ext.baseCSSPrefix + 'item-selected-phone',
},
not selectedItemCls.
-
30 Jan 2013 12:17 AM #4
workaround
workaround
This is an old thread, but I think its a bug.
Even in v4.2 still. The selectedItemCls is never set.
This works:
Code:listConfig: { itemCls: 'ux-check-combo-unselected', listeners:{ afterrender:function(){ this.selectedItemCls = 'ux-check-combo-selected'; } } }


Reply With Quote