Popup detail on mouseover

[Garry Flanigan]

See http://videos.alphasoftware.com and mouseover a Title in a row - notice how data from the same row displays in a bubble text window.
Is there a video showing how this is done?

I can get some way along with by creating a div d1 in the freeform section to right of grid and using following code in onMouseMove event:

var detail={grid.object}._getValue('G','DETAILS',{grid.RowNumber});
$('d1').innerHTML = detail;

DETAILS is the name of my field.

[GGandhi]

Re: Popup detail on mouseover

hello

i don't think you have to work so hard.
the bubble help will take any field in the description
say for example you have a field in the table as description and declare it a varchar field length say 200.
then in the bubble help you insert {description}, that's all there to do. the bubble help will work saying all the things you wrote in the description field.

i just noticed it is details, the field name you have, then just insert {details}.

[Garry Flanigan]

Re: Popup detail on mouseover

Hi Gandhi, the only problem in my case is that DETAILS is html memo so just putting in {details} displays all of the tags.

[GGandhi]

Re: Popup detail on mouseover

then may be you could create a new field that states whatever you want and use that one.

[Garry Flanigan]

Re: Popup detail on mouseover

I tried using *html_to_plain() to save the html data to a second field "PlainDetails" and put {PlainDetails} in the Bubble help. However, the bubble help box does not re-size to suit the data.

[Lance Gurd]

Re: Popup detail on mouseover

Hi Garry,

Here is one of Selwyn's videos that shows how to do it in a list control

[Garry Flanigan]

Re: Popup detail on mouseover

Hi Lance,
Thank you for the tip.
I finally had a look at the video and importantly the technique is more widely applicable.
I have implemented a test version in a UX for context sensitive for a field with onMouseover and onMouseout events. It works as expected in Working Preview but when the UX is in a Tabbed UI the offsets are not as expected - extra amounts are added, but so far I am not sure where the values are coming from.
Any ideas anyone on how to programmatically determine the correct offsets?

If you want to use the method outlined in the video.
1. Add a static text control with property "Static text" as follows:

<div id="floatingMessage" style="display:none; position:absolute;
background: #eee; border: solid 1px #ccc; padding:5px; font:Tahoma 8pt;">
this is a floating message
</div>

2. onMouseover event as follows:

var msg = 'testing 123...';

var ele = $('floatingMessage');
ele.innerHTML = msg;
ele.style.display = '';
positionBubbleHelp(ele,event);

3. onMouseout as follows:

var ele = $('floatingMessage');
ele.style.display='none';

4. Javascript function as follows:

function positionBubbleHelp(ele,event) {
var coords = $e.getCoors(event);
var offsetY = -10;
var offsetX = 10;
ele.style.top = (coords.clientY + offsetY) + 'px';
ele.style.left = (coords.clientX + offsetX) + 'px';
}

[iRadiate]

Re: Popup detail on mouseover

Is it possible to take Garry's code above and display the contents of a grid field instead of 'testing 123...' ?

I've tried var msg = {Grid.object}.getValue('G','FIELDNAME');

This doesn't work, the popup is blank.

[GGandhi]

Re: Popup detail on mouseover

var msg = {Grid.object}.getValue('G','FIELDNAME');

you probably need row number for grids, they are not needed for search and detail.

[iRadiate]

Re: Popup detail on mouseover

you probably need row number for grids, they are not needed for search and detail.

Thank you Ghandi, this works:

var msg = {Grid.object}.getValue('G','FIELDNAME',{grid.rowNumber});