Grid button bubble help?

[Peter.Greulich]

Is there a way? I see there is a OnMouseOver event...

[wmz]

Re: Grid button bubble help?

Hi

I know, it's not fancy (see picture) and it just shows as a rectangle tooltip help, but it is simple:

in the onRowRender event of the grid, I just set the title attribute of the button, i.e.

var ele=$('{Grid.ComponentName}.V.R' + e.rowNumber + '._UNBOUND_BUTTON_1');
ele.title='Your tooltip text goes here';

That's enough to display a tooltip help when the mouse hovers over the button.

Of course, you can build dynamic tooltip texts based on other field values, such as

var ele=$('{Grid.ComponentName}.V.R' + e.rowNumber + '._UNBOUND_BUTTON_1');
var field=$('{Grid.ComponentName}.V.R' + e.rowNumber + '.FIELD_XYZ');
ele.title='Open ' + field.value;

Just replace FIELD_XYZ with your field names...

There are also ways to build more fancy bubble helps using just CSS without any javascript. The trick is to use a new CSS style for the button and define the tooltip text in a <SPAN> for the button. The CSS looks something like

<style type="text/css">
<!--

tooltip:hover {
	position: relative;
}

tooltip span {
	display: none;
}

tooltip:hover span {
	display: block;
   	position: absolute; top: 10px; left: 0;
	/* formatting only styles */
   	padding: 5px; margin: 10px; z-index: 100;
   	background: #f0f0f0; border: 1px dotted #c0c0c0;
	opacity: 0.9;
}

-->
</style>

but I haven't found out where to place the SPAN tags for the button so that it works. Maybe some true Alpha guru knows?

regards

Wolfgang

[Peter.Greulich]

Re: Grid button bubble help?

I know, it's not fancy (see picture) and it just shows as a rectangle tooltip help, but it is simple:

Thanks Wolfgang. That works for me. I'll try it tomorrow.

[Bob Moore]

Re: Grid button bubble help?

Here is a very simple way of doing this :

Use the SPAN tag in the HTML for the button label.
Example :

<SPAN TITLE="This will pop-up a window to add a record">Add Record</SPAN>

You can even add a background image this way:

<SPAN STYLE="background-image: url(/img/background2.gif)">Button Text</SPAN>

And of course you can combine the two.

You can use these techniques wherever Alpha lets you enter HTML.

Note: Works in IE, Safari and Chrome, does not seem to work in my version of Firefox.

[Peter.Greulich]

Re: Grid button bubble help?

Thanks Bob. You're the man!

[wmz]

Re: Grid button bubble help?

Very nice. Much simpler way. Thanks

[Steve Workings]

Re: Grid button bubble help?

does not seem to work in my version of Firefox.

Works in my Firefox v 3.5.6

[Peter.Greulich]

Re: Grid button bubble help?

does not seem to work in my version of Firefox.

Same here.

What is the url/path to build in a5 system images? - e.g. a5image:$$navigate.top

[Steve Workings]

Re: Grid button bubble help?

Here's an example Peter:

<img src="images/a5v9_LargeIcon.png.a5image" >

The one you asked about:

<img src="images/$$navigate.top.png.a5image" >

[Peter.Greulich]

Re: Grid button bubble help?

Thanks Steve. That works nicely.

[Peter.Greulich]

Re: Grid button bubble help?

This did it here:

<img src="images/$$control.clock.png.a5image" alt="Insert START time in 5-minute increments.">

In a button (no text), A5 system image + bubble help.

Thanks again everyone.

[wmz]

Re: Grid button bubble help?

cool.

BTW: to find all built-in A5 images, see post

http://msgboard.alphasoftware.com/al...=system+images