Buy Now
Sign in

frontend tooltips

kai920 , May 15 2008, 08:44
K
kai920 59
May 15 2008, 08:44 #8422
I searched the forum and couldn't find anything - I believe this could be useful for guiding users on how to fill out your forms.

These "tips" would be either:

a) javascript tooltips on hover; or
b) a message displayed in the browser's status bar; or
c) both?

In the chronoforms backend, tooltips are already implemented:


How difficult would it be to get this functionality built into the form for the frontend?

I found some js scripts (for example - here) but if the capability already exists within CF or Joomla, that would be the way to go.

How would we go about using option (b): status bar message depending how which input field was active? I suppose this would be js of some sort as well?
GreyHead 64
May 15 2008, 08:52 #8423
Hi Kai920,

In Joomla 1.5.x use
<?php echo JHTML::_('tooltip', "This is the Form name, It must be Unique." ); ?>
Bob
ChronoForms technical support
If you'd like to buy me a coffee or two, thank you very much
K
kai920 59
May 15 2008, 08:56 #8425
Talk about a lightning fast response! Cheers
K
kai920 59
May 15 2008, 09:03 #8427
PS. Do you know where the CSS is for the tooltip popup? If it's possible I need to make the box height higher to accomodate for more text.
GreyHead 64
May 15 2008, 09:12 #8429
Hi Kai920,

It's in root/libraries/joomla/html/html.php around line 256, or you can use class="editlinktip hasTip" to set your own css I guess.

Bob
ChronoForms technical support
If you'd like to buy me a coffee or two, thank you very much
K
kai920 59
May 15 2008, 13:04 #8434
Bob,

I've been trying to gain an understanding of tooltips. I found a nice tutorial on the Joomla Forums. What is the difference between your code:

<?php echo JHTML::_('tooltip', "This is the Form name, It must be Unique." ); ?>



and what is mentioned in the above thread?

JHTML::tooltip(‘This is the tooltip text’, ‘Tooltip title’, ‘tooltip.png’, ‘’, ‘’, false);


I got an unexpected T_STRING error with the second if I just plug it into the form... specifically I guess my question is what is the difference between JHTML::_('tooltip'... and JHTML::tooltip?

I appreciate any insight you may provide.
GreyHead 64
May 15 2008, 14:20 #8437
Hi kai920,

Pass, Joomla 1.5 has some very sketchy documentation still. I think that the _( version is probably a short-hand.

I think your T-STRING error may be because you have curly quotes in there. Try
JHTML::tooltip('This is the tooltip text', 'Tooltip title', 'tooltip.png', '', '', false);
Bob
ChronoForms technical support
If you'd like to buy me a coffee or two, thank you very much
K
kai920 59
May 15 2008, 14:24 #8439
Right you are - again

Onward to trying to expand the tooltip box.
K
kai920 59
May 16 2008, 15:47 #8500
Final note: I found that after I added this line of code, I could style my tooltips with CSS.


JHTML::_('behavior.tooltip');
M
marald 10
June 12 2008, 17:03 #9493
Hi to all,

first of all, thanks for this great component!
My client should be buying it soon, so we have a registered version of the component on our site.

I've been trying to get the tooltips working in IE6 & IE7 but keep just showing the text "tooltip". Although it works perfectly in firefox and safari and opera.

Also IE6 & IE7 both give javascript errors on the page, but at the mentioned line and char number is no javascript located????

I've tried changing templates, switching off all other javascript in modules/pages/templates but still no go.
The wierdest thing is, that in the chronoform backend, the tooltips do work on IE6 and IE7. Even after comparison of the source code of the backend page and frontend, I can't figure out what is causing this problem.

Any help would greatly be appreciated.

Joomla 1.5.3 / Virtuemart 1.1 / Chronoforms 2.5 RC3.1
GreyHead 64
June 13 2008, 12:14 #9514
Hi marald,

That sounds like there's a small JavaScript conflict with something else that's being loaded on the front-end but not on the back-end. You could try turning things off until the problem goes away. At least then you'd have some idea where the problem is.

The Tooltip is standard Joomla so the problem is most likely with the template or a module.

Bob
ChronoForms technical support
If you'd like to buy me a coffee or two, thank you very much
GreyHead 64
June 13 2008, 12:22 #9516
Hi marald,

I just answered this somewhere else, I can see that you've done some other testing though. The tooltips are Joomla code, I think that they should work but de-bugging JavaScript in is not easy - good luck!

Bob
ChronoForms technical support
If you'd like to buy me a coffee or two, thank you very much
M
marald 10
June 13 2008, 13:05 #9526
Thanks Bob, for your quick reply.

And yep, it was definately a conflict. And I finally found it :laugh: (after spending too many hours on it yesterday and today), but today I found out that when validation was selected in the chronoform the menusysteem (either suckerfish or moomenu) wouldn't work anymore either.

It didn't changed if I used prototype lib or mootools lib for validation, and as stated above changing from suckerfish to moomenu didn't change it either.

Now I found a combination that does work, in IE6/IE7 and Firefox. Menu's work, tooltips work (although I had to do some adjustment for IE)

Here's the config: (for other users who may run into these problems)

- Joomla 1.5.3
- Virtuemart 1.1
- Chronoforms 2.5 RC3.1

Rockettheme template (completly modified)

using following settings:

- mootools for validation in chronoforms
- MooMenu for menu system
- running mootools 1.11 (included in rockettheme)

disable in chronocontact component the mootools 1.11 entry.
(line 45 in chronocontact.html.php)

and in IE6 & IE7 I still had an alt text saying "tooltip" besides the tooltip that was showing, to fix this I removed alt text in this line:

$text   = '<img src="'. $image .'" border="0" alt="'. JText::_( 'Tooltip' ) .'"/>';


by changing to

$text   = '<img src="'. $image .'" border="0" />';


in the file html.php (libraries\joomla\html\html.php)

that's about it.

Okay, I'm getting back to the website..


Marald
M
microdave 6
October 13 2008, 13:39 #15074
Great Component!
I see that this method works for 1.5, what is the method for applying tooltips for Joomla 1.0 templates?
GreyHead 64
October 13 2008, 14:23 #15075
Hi microdave,

The equivalent code in Joomla 1.0 was
<?php echo mosToolTip( "tootip text" ); ?>

Bob
ChronoForms technical support
If you'd like to buy me a coffee or two, thank you very much
A
alasitis 7
February 02 2009, 05:52 #22398
Hi Bob,

First time here ... after trying many other form extensions I have settled on Chronoforms. It's terrific. Kudos to you and all involved. I have forms up and running but am stuck on the fronted tooltips. (As you will see, I'm not strong on code.) I got the tooltip working but I can't seem to get it where I want it. I'm using your code (below)
<?php echo JHTML::_('tooltip', "This is the Form name, It must be Unique." ); ?>
... and I want to place the tooltip just before the field label "Purpose of Loan" (see below) but can't seem to do it. Your help will be greatly appreciated.
<td style="font-family: Verdana; width: 154px; vertical-align: middle;"><span
style="font-family: Palatino Linotype;">Purpose of Loan</span></td>
admin 28
February 02 2009, 09:29 #22411
welcome alasitis,

try this:
    <td style="font-family: Verdana; width: 154px; vertical-align: middle;"><span
style="font-family: Palatino Linotype;"> <?php echo JHTML::_('tooltip', "This is the Form name, It must be Unique." ); ?>Purpose of Loan</span></td>


Cheers
Max
Max
If your main question got answered then please mark the answer using the button!
Did you try the new ChronoForms7 ? if yes then please send us your comments!!
A
alasitis 7
February 02 2009, 18:49 #22450
Thanks, Max, for the very quick reply. It worked! I think I saw something here about making the tooltip a bit fancier so I'll look for that next. Thanks again ...