0

I have the following image tags in my rails app-

<%= link_to image_tag("../../qn/ads.svg"),{:controller => 'cp_details',:action => 'index', :id => empid, :cp => @cmpny.id }, :title=>"company", :class => 'butn' %>
<%= link_to image_tag("../../qn/users.svg"),{:controller => 'groups',:action => 'index', :id => empid, :cp => @cmpny.id }, :title=>"groups", :class => 'butn' %>
<%= link_to image_tag("../../qn/dp.svg"),{:controller=>'dep',:action => 'index', :id => empid, :cp => @cmpny.id,:type=>'dp' }, :title=>"dept", :class => 'butn' %>`

Now I am trying to implement tooltip popup(when clicked or hoverover) with the above links in it. Can anybody please help me to implement the tooltip containing the three links company,groups,dept in a tooltip popup box? I referred and tried the following-

https://gist.github.com/davidjsevans/5617391

Bootstrap Tooltip in Ruby on Rails

Using Tooltips with link_to (Ruby on Rails 3.2.3)

http://archive.railsforum.com/viewtopic.php?id=28485

But I think I don't know to how to implement these in my app. I was trying the js and jquery inside application.js and the link_to code in employ/index.html. I tried implementing it in one of the link_to statement like this:

<%= link_to image_tag("../../qn/ads.svg"),{:controller => 'cp_details',:action => 'index', :id => empid, :cid => @cmpny.id }, :title=>"company", :class => 'butn tag-tooltip', tag, :data => {:toggle=>"tooltip"},'data-original-title' => "Hello",'data-placement' => 'right'%>`

Javascript:

$(document).on("ready page:change", function() {
    $('.tag-tooltip').tooltip();
});

Then I tried this too:

<div id="tooltipelement">
    <a href="#" onclick="javascript:window.location = '/cp_details/index/<%=empid%>?cp=<%=@cmpny.id%>'">Company</a>
</div>

css:

.tooltipelement{
    width: 20px;
    height: 20px;
    background: red;
}

.tooltipelement a {
    display: none;
    padding-left: 30px;
}

.tooltipelement:hover a {
    display: block;
    background: green;
}

But all these did'nt work for me as I don't know to implement them correctly. I want all the three links appear inside the tooltip popup box. Can anyone please help me? Thanks in advance.

Community
  • 1
  • 1
liya
  • 1,525
  • 3
  • 12
  • 15

1 Answers1

1

I think you'd be better using the bootstrap popover plugin - tooltips are mainly for converting the title attribute of links to javascript-powered tooltips


The problem you have is you're trying to include links etc into your tooltips. Tooltips are for text only, and as popovers support HTML, you should be able to include links in each one of them

According to the information provided on the bootstrap website, you'll be best doing this:

<%= link_to "link", path(), class: class="butn", data: { toggle: "popover", content: popover_links } %>

#app/helpers/application_helper.rb
def popover_links
    link_to( "something", something_path ) +
    link_to( "something", something_path )
end

Reference: What is the best way to return multiple tags from a Rails Helper?

Community
  • 1
  • 1
Richard Peck
  • 76,116
  • 9
  • 93
  • 147
  • 1
    sorry to bother you again, I am beginner in rails. `def popover_links link_to( "company", '/cp_details/index/empid.id?cp=@cmpny.id' ) + link_to( "groups", '/groups/index/empid.id?cp=@cmpny.id' ) end <%= link_to "link", path(), class: "butn", data: { toggle: "popover", content: popover_links } %>` here what should I give as the path()? And how to pass the values empid and @cmpny.id to the method popover_links? I think I am realy confused. – liya Apr 24 '14 at 05:12
  • 1
    The `path()` is the URL you want to use. For you, it should be `{:controller => 'cp_details',:action => 'index', :id => empid, :cp => @cmpny.id }` :) – Richard Peck Apr 24 '14 at 08:51
  • You need to read up on [link_to](http://api.rubyonrails.org/classes/ActionView/Helpers/UrlHelper.html) - it will help you see exactly how it should work :) – Richard Peck Apr 24 '14 at 08:52
  • Thanks..:) I am not sure about the method popover_links which I wrote. Is it correct? I think I have made some mistakes over there. :( – liya Apr 24 '14 at 09:15
  • I would say the major problem you have is you're not calling the correct path helpers. You really need to see how to use [rake routes](http://guides.rubyonrails.org/routing.html#listing-existing-routes) – Richard Peck Apr 24 '14 at 09:17