ExtJS 4: Is there any way to attach a QuickTip to a form field?
Using vero4ka's answer I wrote a simple plugin which can be used with forms to enable quicktips on child fields.
Ext.define('Ext.form.QtipPlugin', {
extend: 'Ext.AbstractPlugin',
alias: 'plugin.qtipfields',
init: function (cmp) {
this.setCmp(cmp);
cmp.on('beforerender', function () {
var fields = cmp.query('field[qtip]');
for (var i = 0; i < fields.length; i++) {
fields[i].on('render', this.register, this);
}
}, this);
},
register: function (field) {
var obj = {
target: field.id
};
if (typeof field.qtip === 'string') {
obj.text = field.qtip;
} else if (typeof field.qtip === 'object') {
// Allow qtip configuration objects.
// i.e. qtip: { text: 'hi', ... }
Ext.applyIf(obj, field.qtip);
}
Ext.tip.QuickTipManager.register(obj);
}
});
I found the answer here: How should I add a tooltip to an ExtJS Component?
{
fieldLabel: 'Last Name',
qtip: "This is a tip",
name: 'last',
listeners: {
render: function(c) {
Ext.QuickTips.register({
target: c.getEl(),
text: c.qtip
});
}
}
}
For any form field, you can use this:
{
xtype: 'textfield', // or anything else
autoEl: {
'data-qtip': 'This is working tip!'
}
}
Yes, use the inputAttrTpl config and the data-qtip attribute:
{
fieldLabel: 'Last Name',
inputAttrTpl: " data-qtip='This is my quick tip!' ",
name: 'last'
}