How to add HoverText in to Edit Box in PeopleCode

PeopleCode Field Class provide a property called HoverText which you can use to display a tooltip/Hover text for any push buttons or hyperlink associated with the field.
To do that you can use something like;

QE_ABSENCE_HIST.QE_ABSENCE_TYPE.HoverText = "This is my HoverText";

A couple of limitation of using HoverText property is;

The maximum length of hover text is 100 characters
If the hover text is identical to the push button or hyperlink label, the hover text will not be shown

Above property cannot be used in Edit Boxes if you want to use Hover text. So, what if you have a requirement to implement a Edit Box Hover Text how you are going to do that?

This is a little hack I tried recently using JavaScript to show a Hover Text for Edit Boxes.

Steps:

Add a field called HTMLAREA to a derived/work record (e.g TEST_MY_DRV.HTMLAREA)
Add record field (TEST_MY_DRV.HTMLAREA) to the page you want to the scroll level 0 (Make sure to reduce the size of the field in App designer and but ensure you can see it on the page).

for example;

Now in page Activate PeopleCode event add the following PeopleCode with the JavaScript code in it.

Local string &cDoublequote = """";

TEST_MY_DRV.HTMLAREA.Value = "<script type=" | &cDoublequote | "text/javascript" | &cDoublequote | " language=" | &cDoublequote | "javascript" | &cDoublequote | ">" | "function yourFunction() { document.getElementById(" | Quote("MY_RECORD_MY_FIELD_A") | ").title=" | &cDoublequote | "This is the hover text for the MY_RECORD.MY_FIELD_A" | &cDoublequote | "; } window.onload = yourFunction(); </script>";

The JavaScript code is pretty simple and looks like this;

The outcome will be

Few things to keep in mind;

This JavaScript will find the Edit Box using the ID in the HTML document which is loaded in to your browser and use window.onload built-in JavaScript method to load the JavaScript when page loads. I couldn't find out a way without using window.onload as I believe if we do not use window.onload, PeopleSoft will ignore the JavaScript we injected.
To find the Edit Box ID (or in other words input type = text in HTML) you can press F12 to open Developer Tools (works in most browsers) and check the ID for the Edit Box you want. On the other hand you can assume (sorry I cannot take the risk :-)) that the ID will be record (underscore) field (RECORD_FIELD)

Next step

I'm sure that you can use this technique to other page controls as well (check boxes and radio buttons for example). With JavaScript there is so much potential to do fancy stuff and with jQuery you can event beautify the Hover Text you want.

An alternative way

(copy paste from http://www.compshack.com/forum/peoplesoft/peoplesoft-technical/tooltip-text-peoplesoft) -
Note: I haven't tested this, so I cannot make any comments.

Peoplesoft does not support Editbox mouseovers. However a sort of mouse over effect can be created by in Editbox using the help of PushButton object.
1) Select the Editbox for which you need mouseover
2) Take a screenshot using print screen and take out the field label. For example we are making AssessmentID label.
Save this as image object in peoplesoft.
3) Remove the label of the field from field properties.
4) Put a pushbutton where previous the field’s label use to come. Make pushbutton destination as Page Anchor (anything else will also do). Goto 2nd tab named label, Select pushbutton label type as image and select your image object(created in step2). Now the label text on left will act as a mouseover.

Now we have a pushbutton disguised as a field’s label and it has mouseover effect.

to change mouseovers for buttons on grid/acroll area goto its properties put text there(on left side of image)