Tuesday 4 January 2011

Adding tooltips to your APEX report

There are a number of ways to publish tooltips in your application, many of them much more verbose than they need to be.

Some of them implement fairly fancy JavaScript and CSS, but there is a simple way to plug in the default tooltip behaviour into your Apex reports.

When you edit your report column attributes, add the following code into the HTML expression.

<span title="#MY_TOOLTIP_COLUMN#">#MY_COLUMN#</span>

These attributes typically have decent help in regard to the sort of coding examples you can apply.
So this setup places the data from the selected column my_tooltip_column, and displays the value in my_column as you'd normally expect.

And is the display from Google Chrome:
Simple but effective - and flexible.

See a variation on this example here.


Unknown said...

Thanks for the tip. This helped me alot.

Scott Wesley said...

Sometimes it's just the little things ;-)

Przemysław Staniszewski (Przemek) said...

Nice tip. I love simple and useful ideas without tons of scripts and workarounds. Thanks!

Anonymous said...

Thank you very much for this very useful tip.

Unknown said...

Do you know if it's possible to add an image instead of a text message?

Scott Wesley said...

No doubt this could be done with a more powerful tooltip plugin, but this is an old post using native HTML. Google something not specific to APEX

Unknown said...

Hi Scott,

Could you please help me on my below tooltip requirement.

My field 'EMP_DESCRIPTION' is text format in tabular form.
I worked out above tool tip solution for a tabular form, but the problem I am facing is when I edit the column and paste the span title code in HTML Expression of the column, my field is converting into display only,but tooltip is working and showing column value in tooltip.

I need the solution such a way that when I apply tool tip my field does not change and tool tip should show the content(value) of that column.

Thanks in advance


Scott Wesley said...

Try adding just the title="" tag as a custom attribute on the column instead. By using the HTML expression, you're overwriting the default tabular functionality. Otherwise, you'd need to use apex_item.text() within your SQL.

Try ask on the OTN forum for APEX if you continue to have trouble.

You may also like to read this