PDA

View Full Version : Add tooltip to Expand/Collapse icon and Minimize and Maximize icon



ravigupta84
10 Sep 2010, 5:17 AM
I want to add tooltip on Expand/Collapse icon and Minimize and Maximize

var navPanel = new NavPanel({
id: 'mainIcomWest',
region: 'west',
closable: true,
collapsible: true,
split: true
});

NavPanel = Ext.extend(Ext.form.FormPanel, {
layout: 'accordion',
width: '14%',
title: '<cl:message code="navigation" />',

initComponent: function() {

var orders = new Ext.Panel({
id: 'MyIcom'
title: 'Digite',
autoHeight: true,
border: false,
buttonAlign: 'right',
bodyStyle: 'padding-top:5px;',
cls: 'nav-links',
});
NavPanel.superclass.initComponent.apply(this, arguments);
},

afterrender:function(){
alert(this.getTool('toggle'));

NavPanel.superclass.afterRender.call(this);
Ext.QuickTips.register({
target: this.getEl('toggle'),
text: L10n.getL10nMessage('icon')
});


});
Ext.reg('NavPanel', NavPanel);

=====================================

Condor
10 Sep 2010, 6:00 AM
new Ext.Viewport({
layout: 'border',
items: [{
region: 'west',
width: 200,
title: 'West',
collapsible: true,
layout: 'accordion',
toggleTip: {
text: 'Collapse'
},
listeners: {
render: {
fn: function(c){
c.toggleTip.target = [c.tools['toggle'], c.ownerCt.layout[c.region].getCollapsedEl().dom.firstChild];
Ext.QuickTips.register(c.toggleTip);
},
delay: 1
},
expand: function(c){
c.toggleTip.text = 'Collapse';
},
collapse: function(c){
c.toggleTip.text = 'Expand';
}
},
items: [{
title: 'Panel 1',
toggleTip: {
text: 'Collapse'
},
listeners: {
render: function(c){
c.toggleTip.target = c.tools['toggle'];
Ext.QuickTips.register(c.toggleTip);
},
expand: function(c){
c.toggleTip.text = 'Collapse';
},
collapse: function(c){
c.toggleTip.text = 'Expand';
}
}
},{
title: 'Panel 2',
toggleTip: {
text: 'Collapse'
},
listeners: {
render: function(c){
c.toggleTip.target = c.tools['toggle'];
Ext.QuickTips.register(c.toggleTip);
},
expand: function(c){
c.toggleTip.text = 'Collapse';
},
collapse: function(c){
c.toggleTip.text = 'Expand';
}
}
}]
},{
region: 'center',
title: 'Center'
}]
});

r.melnyk
11 Dec 2012, 10:14 AM
Hello Condor,

It seems that your code is not working correctly anymore. Now the Ext.QuickTips.register requires element.

I changed this part and it started working for me:


render: function(c){
c.toggleTip.target = c.tools['toggle'].el;
Ext.QuickTips.register(c.toggleTip);
}