EXTJS Combobox tooltip

Question

Am having a combobox which has its data populated from a SQL database, using a store. I want to display the tooltips for each of the item in the combobox and these tooltips are also stored in the database. So, how should i get them.

function loadGENEXTst(full) {

if(GENEXTst == null) {
    GENEXTst = Ext.create('Ext.data.Store', {
        model : 'SimpleModel',
        proxy : {
            type : 'ajax',
            url : 'data/Extensions.aspx',
            reader : {
                type : 'json',
                root : 'Rows',
                totalProperty : 'TotalRows'
            },
            actionMethods : {
                create : 'POST',
                read : 'POST'
            },
            extraParams : {
                mode : 'GENERICLIST',
                start : 0,
                limit : SYSTEM.listLimit
            }
        },
        autoLoad : false
    });
} else {
    delete GENEXTst.lastParams
}

if(full) {
    GENEXTst.proxy.extraParams.mode = 'FULLLIST';
} else {
    GENEXTst.proxy.extraParams.mode = 'GENERICLIST';
}

GENEXTst.proxy.extraParams.ProjDB = SYSTEM.iSecure;

GENEXTst.load();

}

The aspx file in turn has a function which calls the stored procedure to populate the combobox. So, how do i populate the tooltips for each of the item in the combobox?

My model is as follows:

Ext.define('SimpleModel', {
extend : 'Ext.data.Model',
fields : ['itemID', 'Title', 'Short', 'Type', 'isActive', 'TotalRows']
});

So, is the following code correct?

getInnerTpl:function(){
        return '<div data-qtip="{Short}">{Title}</div>';
    }

The field short contains the tooltips and the field title contians the combobox list.

Answer 1

You can try to use Ext.XTemplate and refer to customTplCombo