Why there are no icons for the buttons in itemselector?

Question

I am trying to use the Ext.ux.form.ItemSelector,but no icons are on the add/remove/top/down buttons! Code below:

Ext.create('Ext.ux.form.ItemSelector', {
        renderTo: Ext.getBody(),
        name: 'channelRange',
        store: Ext.create('Ext.data.Store', {
            fields: ['display', 'value'],
            data: [{
                display: '22',
                value: 2
            }, {
                display: '33',
                value: 3
            }]
        }),
        buttons: ['add', 'remove'],//No icons on the buttons! Why?
        //imagePath: '../ux/images/',
        displayField: 'display',
        valueField: 'value',
        value : [ 3 ],
        allowBlank: false
    });

See the result here, the buttons between the 2 multiselect have no icon!

Answer 1

Solution from my project:

grid.tbar.push({
    itemId  : 'create',
    iconCls : 'iconAdd',
    text : 'Add'
}

and config in some .css file:

.iconAdd {background: url(/resources/img/action-add.png) no-repeat !important;} 

Answer 2

Yes it is an issue with ItemSelector. You will not see any icon on buttons after any kind of BUILD.

I was able to resolve this issue permanently via overriding below CSS. Actually if you debug the code you will see that it is trying to location these button icons on different location.

// Do these overrides in any of your CSS file.
.x-form-itemselector-top {
    background-image: url(images/itemselector/top.gif) !important;
}
.x-form-itemselector-up {
    background-image: url(images/itemselector/up.gif) !important;
}
.x-form-itemselector-add {
    background-image: url(images/itemselector/right.gif) !important;
}
.x-form-itemselector-remove {
    background-image: url(images/itemselector/left.gif) !important;
}
.x-form-itemselector-down {
    background-image: url(images/itemselector/down.gif) !important;
}
.x-form-itemselector-bottom {
    background-image: url(images/itemselector/bottom.gif) !important;
}

NOTE: Also make a sure you have these icons on given path (images/itemselector/). In my case I copied these icons from "ui-client\ext\packages\ux\classic\resources\images\itemselector" to "ui-client\resources\images\itemselector". Here "ui-client" is my application root folder.

Hope above provided information will help.