Forum: Ruby on Rails handling events: mouseover, etc.

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
Chris H. (Guest)
on 2006-03-09 21:20
I'm having a hard time figuring out how to handle mouseover events w/
Ruby on Rails (esp. whether Javascript takes over, or the Controller
should be used).

I'm currently trying to create a simple mouseover info box showing the
definition, and some other information, when certain words are
moused-over.

Say I have an array of Word objects that have 1) word name 2) definition
3) latin origin.
From my controller, I create a list of words by rendering partial (to
the div element "word_list") the collection (using a _word.rhtml
partial)

In the _word.rhtml partial:
How do I set up a trigger for the onmouse over using link_to (assuming
that's the best func to use)?
How do I get the Word object definition, etc. into the (currently
hidden) info box when someone does mouseover? Is it best done through
the controller or though a call to a Javascript function?

Finally, where is the positioning of the info box set? (so it appears
next to the word it is defining)

I hope this is clear enough and thank you so very much in advance!
Josh on Rails (Guest)
on 2006-03-09 21:50
(Received via mailing list)
On 3/9/06, Chris H. <removed_email_address@domain.invalid> wrote:
>
> I'm having a hard time figuring out how to handle mouseover events w/ Ruby
> on Rails (esp. whether Javascript takes over, or the Controller should be
> used).


You should (you have to, really) use JavaScript for anything on the
client -
any browser-side event = JavaScript. But the data (the definition, or
whatever) can come from the server (Rails) if you want it to - that's up
to
you.

I think the approach I'd take for something like this, would be to load
up a
bunch of divs:

<div id="definition_word1" class="definition"><blah></div>
<div id="definition_word2" class="definition"><blah></div>

Set up your stylesheet to hide these divs, then use a onmouseover event
to
turn the on and position them.



-- Joshua
Kevin O. (Guest)
on 2006-03-09 22:02
(Received via mailing list)
My solution to this would be to wrap the relevant words in a
'content_tag' call

<%= content_tag('span','word', "title"=>"definition") %>

This should result in a tooltip with the definition on most browsers.

_Kevin
This topic is locked and can not be replied to.