PDA

View Full Version : ToolTip on Warning MessageBox



sharadtitan2006
9 Sep 2010, 9:29 PM
22319

ToolTip on Warning MessageBox.
ToolTip for Warning Image as - Warning
ToolTip for close Image as - close
ToolTip for OK Button as - OK

I am using ExtJS-3.0

Please help, its urgent.

evant
9 Sep 2010, 9:30 PM
In future if you're asking for help, please post in the HELP forum. Thanks.

Condor
9 Sep 2010, 10:27 PM
Ext.MessageBox is notorious for being one big class with all private data.

You are probably better off writing your own Ext.Window based class which makes it a lot easier to add your own tooltips.

sharadtitan2006
10 Sep 2010, 1:27 AM
Thanks for the reply.
We cannot create our own class we have to use existing one, so what should we do, is there any way out?

Please help, as it is urgent.

Condor
10 Sep 2010, 1:52 AM
var dlg = Ext.Msg.getDialog();
Ext.QuickTips.register({
target: dlg.tools['close'],
text: 'Close'
});
var okBtn = dlg.getFooterToolbar().find('text', Ext.Msg.buttonText['ok'])[0];
Ext.QuickTips.register({
target: [okBtn.btnEl, okBtn.btnEl.parent('.x-btn-mc')],
text: 'OK'
});
Ext.QuickTips.register({
target: dlg.body.child('.ext-mb-icon'),
text: 'Icon'
});

Ext.Msg.show({
title: 'Warning',
msg: 'Please input values for all required fields, then resubmit.',
buttons: Ext.Msg.OK,
icon: Ext.Msg.WARNING
});

sharadtitan2006
10 Sep 2010, 2:39 AM
Thanks for the reply, it is working partly but I am getting this JS Error, I am using ExtJS version 3.0.0:
---------------------------------------------
dlg.getFooterToolbar is not a function
---------------------------------------------

Please help.

Condor
10 Sep 2010, 3:00 AM
For Ext 3.0.0 you can replace "getFooterToolbar()" with "fbar".

sharadtitan2006
10 Sep 2010, 3:16 AM
Thanks for the reply.
Below is the code I am using on ExtJS 3.0.0, as suggested by you but it is still giving the error that fbar is not defined.
The code in the Bold and italic is running fine but the code in Bold and not italic is not running and giving JS Error.
--------------------------------------------------------------
warn: function(extraParam) {
var baseParams = {
title: L10n.getL10nMessage("cl.global.warn.caption"),
icon: Ext.MessageBox.WARNING,
cls:'cl-alert-warn',
buttons: Ext.Msg.OK
};
var dlg = Ext.MessageBox.getDialog();
Ext.QuickTips.register({
target: dlg.tools['close'],
text: 'Close'
});
var okBtn = dlg.fbar().find('text', Ext.MessageBox.buttonText['ok'])[0];
Ext.QuickTips.register({
target: [okBtn.btnEl, okBtn.btnEl.parent('.x-btn-mc')],
text: 'OK'
});

Ext.QuickTips.register({
target: dlg.body.child('.ext-mb-icon'),
text: 'Icon'
});

Ext.apply(baseParams, extraParam);
Ext.MessageBox.show(baseParams);


}
-------------------------------------------------------

Please help. Its urgent.

Condor
10 Sep 2010, 3:37 AM
No, "fbar" and not "fbar()"!

sharadtitan2006
10 Sep 2010, 3:41 AM
Thanks for the update everthing is working now.
Great thanks.

Animal
10 Sep 2010, 4:10 AM
Thanks for the reply.
We cannot create our own class we have to use existing one

Who says? Your tutor?

sharadtitan2006
10 Sep 2010, 4:36 AM
I have corrected the code and it is working fine.

But the problem I am facing now is that:
For warn it is working fine but not for info, also info icon is showing tooltip of warning icon.
The same code I have added with appropriate modification in - info
The code pasted below is in the same file with the same sequence as below.

The Code is attached below:
---------------------------------------------------------------------------------------------------------------- warn: function(extraParam) {
var baseParams = {
title: 'Warning',
icon: Ext.MessageBox.WARNING,
cls:'cl-alert-warn',
buttons: Ext.Msg.OK
};

var dlg = Ext.MessageBox.getDialog();
Ext.QuickTips.register({
target: dlg.tools['close'],
text: 'Close'
});
var okBtn = dlg.fbar.find('text', Ext.MessageBox.buttonText['ok'])[0];
Ext.QuickTips.register({
target: [okBtn.btnEl, okBtn.btnEl.parent('.x-btn-mc')],
text: 'OK'
});

Ext.QuickTips.register({
target: dlg.body.child('.ext-mb-icon'),
text: 'Warning'
});

Ext.apply(baseParams, extraParam);
Ext.MessageBox.show(baseParams);
},
info: function(extraParam) {
var baseParams = {
title: 'Info',
icon: Ext.MessageBox.INFO,
buttons: Ext.Msg.OK
};

var dlg = Ext.MessageBox.getDialog();
//Ext.QuickTips.unregister(dlg);
Ext.QuickTips.register({
target: dlg.tools['close'],
text: 'Close'
});
var yesBtn = dlg.fbar.find('text', Ext.MessageBox.buttonText['yes'])[0];
Ext.QuickTips.register({
target: [yesBtn.btnEl, yesBtn.btnEl.parent('.x-btn-mc')],
text: 'YES'
});

var noBtn = dlg.fbar.find('text', Ext.MessageBox.buttonText['no'])[0];
Ext.QuickTips.register({
target: [noBtn.btnEl, noBtn.btnEl.parent('.x-btn-mc')],
text: 'NO'
});

Ext.QuickTips.register({
target: dlg.body.child('.ext-mb-icon'),
text: 'Info'
});

Ext.apply(baseParams, extraParam);
Ext.MessageBox.show(baseParams);
}


-------------------------------------------------------------------------------------


Please help. Its urgent.

Condor
10 Sep 2010, 4:46 AM
There is only one dialog, so you don't need to register the tips every time you need to show the messagebox.

Unfortunately, this also means that there is just one icon that is used to display different images.

You will have to replace (unregister + register) the quicktip every time you use MessageBox with a different icon.

sharadtitan2006
10 Sep 2010, 4:55 AM
Thanks for the update.
But I am also not getting the YES and NO tooltips.

Please help.

Condor
10 Sep 2010, 4:59 AM
That is strange... Are yesBtn and noBtn correctly found?

ravigupta84
10 Sep 2010, 6:07 AM
Got it thanks

sharadtitan2006
10 Sep 2010, 7:29 AM
Thanks for the reply, It is working fine now.