That’s maybe an old tip and probably everybody already knows it, but because I just answered that question on the OraFAQ forum, I wanted to share it with you in case you didn’t know.
Maybe you have already noticed that in the Oracle APEX Builder at some pages a tooltip is used. For example for the icons on the Drag and Drop Layout page. This tooltip functionality can be reused in your own applications. You just have to add
onmouseover="toolTip_enable(event,this,'This is a tooltip')"
into the “Attributes” property of your HTML button or into the “HTML Form Element Attributes” property of your page item. In the end you can attach it to any HTML element. But I think you got the idea how it works.
August 19th, 2007 at 23:44
One more tip with this for anyone:
Create a label with help on mouseover.
Put the following in the “Before label” entry of the label template:
(Change < and > for [ and ], this blog does not accept all html tags)
———————————-
[label for="#CURRENT_ITEM_NAME#" tabindex="999"][a class="t10OptionalLabelwithHelp" href="#"
onmouseover="toolTip_enable(event,this,getText('#CURRENT_ITEM_ID#','&SESSION.'))"
tabindex="999"]
———————————-
August 20th, 2007 at 02:39
Hi Guido,
is it possible that getText is a self written javascript function? Because I couldn’t find it in htmldb_html_elements.js and htmldb_get.js
Patrick
August 20th, 2007 at 05:40
Indeed, you’re right!
I’ve written this some time ago so I already forgot getText was not standard. That makes the example quite useless isn’t it?
It’s an ajax script that looks up the helptext
I would make the ajax call with prototype.js, but for completeness here’s some working example.
You never know who might read it
Here’s the code:
————————
function getText(itemid, sessionid) {
http_request = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,…
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
// set type accordingly to anticipated content type
http_request.overrideMimeType(’text/html’);
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject(”Msxml2.XMLHTTP”);
} catch (e) {
try {
http_request = new ActiveXObject(”Microsoft.XMLHTTP”);
} catch (e) {}
}
}
if (!http_request) {
alert(’Cannot create XMLHTTP instance’);
return false;
}
http_request.open(’GET’, ‘wwv_flow_item_help.show_help?p_item_id=’+itemid+’&p_session=’+sessionid, false);
http_request.onreadystatechange = showLabel;
http_request.send(null);
return returnText;
}
function showLabel() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
var labelText = http_request.responseText;
var searchStringTextBegin = ‘[span class="instructiontext"]‘;
var searchStringTextEnd = ‘[/span]‘;
var searchLocBegin = labelText.indexOf(searchStringTextBegin) + searchStringTextBegin.length;
var searchLocEnd = labelText.indexOf(searchStringTextEnd, searchLocBegin);
returnText = labelText.substr(searchLocBegin, searchLocEnd);
}
}
}
———————
Regards Guido
November 27th, 2007 at 11:17
Just a question for anyone here.. Tried the above code and it works okay in IE 6.0 (tool tip has isue with list boxes in front of it, Thanks MS..)
However, posted codes does NOTHING in Firefox 2.x.. Is there an issue?
November 27th, 2007 at 11:24
Just tried it again with FF and it works as expected. Check out the following link http://apex.oracle.com/pls/otn/f?p=2672:1. Do you see a tooltip when you put your mouse over the “Tooltip” textfield?
Patrick
July 20th, 2009 at 13:49
I didn’t know this yet, and I’ve been looking for days for this information, having been working with APEX for about a year!
I’ve never done web development before my current APEX project, so on behalf of formerly pure-Oracle guys like me, thanks for not assuming that this was old news (even though your original posting was two years ago!)
July 20th, 2009 at 23:04
You are welcome!
February 11th, 2010 at 06:23
Hi,
The tooltip is perfect, but can the rectangular box in which the text is being displayed be changed? Is it possible to display the text in a different call out box instead of the rectangular one?
Thanks,
Vignesh