Reload tool on combo list

Client side caching of data via stores is one of the most useful features of Ext JS.
However in a multi user environment, you may wish to give users the ability to refresh their stores, perhaps to reflect a change made by another user. This is easy to do with grids as you can add a refresh tool to the panel title. But how do you go about providing a nice refresh button for a combo box? 
By overriding the default initlist function of the combo box you can render a nice refresh tool in the combo view's title.

Ext.override(Ext.form.ComboBox, {

    initList : function(){
        if(!this.list){
            var cls = 'x-combo-list';

            this.list = new Ext.Layer({
                shadow: this.shadow, cls: [cls, this.listClass].join(' '), constrain:false
            });

            var lw = this.listWidth || Math.max(this.wrap.getWidth(), this.minListWidth);
            this.list.setWidth(lw);
            this.list.swallowEvent('mousewheel');

            this.assetHeight = 0;            

            if(this.title){
                this.header = this.list.createChild({cls:cls+'-hd', html: this.title});
                this.assetHeight += this.header.getHeight();
            }

            if(this.reload){
                if(!this.header){
                    this.header = this.list.createChild({cls:cls+'-hd',html:' '});
                }
                this.refreshTool = Ext.DomHelper.insertFirst(this.header,'
 
',true);
                this.refreshTool.addClassOnOver('x-tool-refresh-over');
                this.refreshTool.dom.qtip = 'Reload list';
                this.refreshTool.on('click',function(){
                    this.refreshTool.removeClass('x-tool-refresh-over');
                    this.store.load();
                },this);
                this.assetHeight += this.header.getHeight();
            }           

            this.innerList = this.list.createChild({cls:cls+'-inner'});
            this.innerList.on('mouseover', this.onViewOver, this);
            this.innerList.on('mousemove', this.onViewMove, this);
            this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));

            if(this.pageSize){
                this.footer = this.list.createChild({cls:cls+'-ft'});
                this.pageTb = new Ext.PagingToolbar({
                    store:this.store,
                    pageSize: this.pageSize,
                    renderTo:this.footer
                });

                this.assetHeight += this.footer.getHeight();
            }

            if(!this.tpl){            
                this.tpl = '
{' + this.displayField + '}';
            }            

            this.view = new Ext.DataView({
                applyTo: this.innerList,
                tpl: this.tpl,
                singleSelect: true,
                selectedClass: this.selectedClass,
                itemSelector: this.itemSelector || '.' + cls + '-item'
            });            

            this.view.on('click', this.onViewClick, this);            
            this.bindStore(this.store, true);            

            if(this.resizable){
                this.resizer = new Ext.Resizable(this.list, {
                    pinned:true, handles:'se'

                });
                this.resizer.on('resize', function(r, w, h){
                    this.maxHeight = h-this.handleHeight-this.list.getFrameWidth('tb')-this.assetHeight;
                    this.listWidth = w;
                    this.innerList.setWidth(w - this.list.getFrameWidth('lr'));
                    this.restrictHeight();
                }, this);

                this[this.pageSize?'footer':'innerList'].setStyle('margin-bottom', this.handleHeight+'px');

            }
        }
    }
});

The key bit here is

    if(this.reload){
                if(!this.header){
                    this.header = this.list.createChild({cls:cls+'-hd',html:' '});
                }

                this.refreshTool = Ext.DomHelper.insertFirst(this.header,'
 
',true);

                this.refreshTool.addClassOnOver('x-tool-refresh-over');
                this.refreshTool.dom.qtip = 'Reload list';
                this.refreshTool.on('click',function(){
                    this.refreshTool.removeClass('x-tool-refresh-over');
                    this.store.load();
                },this);

                this.assetHeight += this.header.getHeight();

            }

If you then include reload: true in your combo box config, you will get a nice reload icon in the title of the list like so