Links in navbar with Rails and Bootstrap - html

Say I have a navbar:
<ul class="nav navbar-nav">
<li><%= link_to 'Item 1', item1_path %>
<li><%= link_to 'Item 2', item2_path %>
...
But this way current menu item is also a link. How do I make it into a span, preserving appearance? Which doesn't look like a good options, since in this case I need to duplicate bootstrap's styles. Or make it look like a menu item without it pointing to any page?

A link_to method will always render an <a> tag, but you can render a <span> inside of the <a> tag if you use link_to ... do
This is an example taken from this documentation
<%= link_to(#profile) do %>
<strong><%= #profile.name %></strong> -- <span>Check it out!</span>
<% end %>
<!-- which renders -->
<a href="/profiles/1">
<strong>David</strong> -- <span>Check it out!</span>
</a>

I came up with the following helper:
module ApplicationHelper
def menu_item(name, path)
if current_page? path
content_tag('a', name)
else
link_to name, path
end
end
end
With that we've just got to replace link_to with menu_item in original code.

Related

How to attach an URL to an image

I tried different ways to display a picture in my rails app,and when the user clicks on that he should be redirected to the URL i specify.
I tried this method,"rails method"
<li <%= link_to new_gig_path %><%= image_tag 'v.png' %></li>
and just the image was showing,but the image wasn't clickable.
than i tried this"HTML method" <img src="link to an image"/>
And it worked as i wanted,the image appeared,and when i clicked on it,it redirected where i wanted.The problem is that it is wrapped in <a></a> tags,but i need the code to be wrapped in <li></li> tags,
note:I also tried to wrap the <a></a> tags in <li></li> tags but it destroyed my design,i do need it to be just in <li> tags
looking into my navigation bar,you see that my nav-bar is structured in <li>tags
#instead of this comment I want to put the code,i am asking help with
<li><%= link_to '+Add Box', new_gig_path, id: "addgig" %></li>
<li><%= link_to 'Edit Profile',edit_user_registration_path, id: "menu-overwritten" %></li>
<li><%= link_to "Log out", destroy_user_session_path, :method => :delete, id: "menu-overwritten"%></li>
More info:
Also i tried this method
<li><img src="a link to an image" height="30" width="159" ></li>
This time it worked as well,but i don't think it is gonna be responsive if i leave this method.This is definitely not the rails way.
Thank you.
<li>
<%= link_to new_gig_path do %>
<%= image_tag 'v.png', class: 'your-class' %>
<% end %>
</li>

how to highlight current link in rails 3

I am trying to highlight curent link. I used this question for ideas here
I have simple menu, that is based on this structure:
<li>
<%= #waste_root.name %>
<ul>
<% #wast_child_ids.each do |it| %>
<li><%= link_to it.name, products_path(:category => it.name), class: "#{cp(products_path)} additional_class" %>
</li>
<%end%>
</ul>
</li>
In Aplication helper:
def cp(path)
"current" if current_page?(path)
end
In CSS file:
.current {
color:red;
}
What I get is all links are in red color. I don't get it. For others it worked just fine.
I think your path in view should look like this:
<li>
<%= #waste_root.name %>
<ul>
<% #wast_child_ids.each do |it| %>
<li><%= link_to it.name, products_path(:category => it.name), class: "#{cp(products_path(:category => it.name))} additional_class" %>
</li>
<%end%>
</ul>
</li>
Because, you're passing a param category in products_path and hence current_page? isn't able to judge the correct relative path. Also, it'd be better if you use the _url(complete path) instead of relative path. It'll be much clear to cross check and to understand as well.
You need to pass the category.
<%= link_to it.name, products_path(:category => it.name), class: "#{cp(products_path(:category => it.name))} additional_class" %>
They're all on the products path because you're just differentiating based on parameters. So just passing the products path they all return true, you need to differentiate based on the parameters by passing them too as you've done in your link

Converting wrapped anchor tag HTML to link_to

I'm messing around with Bootstrap. There's some HTML code which is wrapped by an anchor tag. I'm not really sure how to convert it to the Rails link_to method. I looked at the Ruby on Rails documentation for link_to but I still cannot figure it out.
Here's the code:
Dropdown <b class="caret"></b>
I tried the following but it's incorrect:
<% link_to("Users", users_path, { data: { toggle: "dropdown" }, class: "dropdown-toggle"} ) do %>
<b class="caret"></b>
<% end %>
If the href is a pure '#" but no variables at all, it's better to copy the code directly from Bootstrap than making a link_to.
If you want to add variable/method say user_path, with this complex anchor, it's better to use the block argument of link_to. Move the first argument which is usually the anchor to the block.
<%= link_to users_path, data: {toggle: "dropdown"}, class: "dropdown-toggle" do %>
<b class="caret"></b>
<% end %>

Rendering view for an element in rails by :id

I have a sidebar that contains links to all of a users :shopping_lists. Upon clicking on one of those links, I'd like to render a page showing the :list_items in that particular list. Here's my sidebar partial:
<aside class="sidebar-nav-fixed">
<h1>My Lists</h1>
<% if user_signed_in? %>
<% current_user.shopping_lists.each do |l| %>
<ul>
<%= link_to "#{l.name}", '#' %>
</ul>
<% end %>
<% else %>
<h5><%= link_to "Sign in to manage lists.", new_user_session_path %></h5>
<% end %>
</aside>
My question is: what path would I be putting in place of my current stub link in order to route to the correct list? Thanks in advance!
That will depend on how your routes are setup. I would expect shopping lists to always be in the context of a user, so probably something like this:
<%= link_to l.name, user_shopping_list_path(current_user, l) %>
If shopping lists are a top level route, then probably something like this:
<%= link_to l.name, shopping_list_path(l) %>
There are couple of things you can do, granted your routes are setup correctly:
The easiest is:
link_to "#{l.name}", l
Rails should create a link something similar to http://host/shopping_lists/2
The above is a shorthand for
link_to "#{l.name}", shopping_list_path(l)
To see a list of available routes and methods you can run:
bundle exec rake routes
in the root of your rails app

Link_to in rails and dynamic names from modal#show

I have a loop that creates a list of works from the modal work
//does work but want test to be <%= work. name %>
<ol class="meny-control mobile">
<% #works.each do |work| %>
<li class="" data-id="<%= work.id %>"><%= link_to 'test', work %></li>
<% end %>
</ol>
//doesnt work but want it to
<ol class="meny-control mobile">
<% #works.each do |work| %>
<li class="" data-id="<%= work.id %>"><%= link_to '<%= work.name %>', work %></li>
<% end %>
</ol>
As you would guess the <%= work.name %> throws a syntax error. How do I correctly format the link_to to display each work.name as the 'path' && the anchor's inner html as work.name.
Being new to rails, I'm still really iffy on understanding documentation properly. Could you please reference from link_to() (if even there) where this format is explained so I use this for future referencing & understanding --also how to properly edit the stack question title for future similar question.
The error is because of the nesting of <% tags and I suppose you already are aware of that. To solve your problem use the following:
<%= link_to "#{work.name}", work %>
The #{} is used to interpolate variables, i.e. replacing variables with their values within the string literals as in link_to "#{work.name}" above where work.name will be replaced by the value work.name holds.
you don't need "#{}".
you can write this:<%= link_to work.name, work %>