ansaurus

Question

How can i conditionally style a <li> in rails?

Answer 1

+2 A:

if each li is linked to different controller you can use controller_name to add or not the selected class

Here is an example from my app, it's in haml

  %ul
    %li
      %a{:href => '/kebabs', :class => ('current' if controller_name == 'kebabs')} Admin kebabs
    %li
      %a{:href => '/statistics', :class => ('current' if controller_name == 'statistics')} Statistiques
    %li
      %a{:href => '/people', :class => ('current' if controller_name == 'people')} Admin Personnes

cheers

denisjacquemin 2010-02-21 18:52:45

That code is begging on its knees for a helper method!

Shtééf 2010-02-21 19:06:47

I think that will work. I haven't seen the %ul %a markup before, though, what is that called so I can look into it more?

NotDan 2010-02-21 19:35:32

visit http://haml-lang.com/ ... much better than erb, well, that's my point of view ;o)

denisjacquemin 2010-02-21 19:39:25

Answer 2

A:

You can also use css for this. Give each the body each page a class and id from your controller and action names.

<body class="<%= controller.controller_name %>" id="<%= controller.action_name %>">

Then give your ul and li elements an id.

<ul id="nav'>
  <li id="about"></li>
  <li id="contact"></li>
  <li id="blog"></li>
</ul>

Now you can reference a specific link on a specific page from your stylesheet.

body.blog#index ul#nav a#blog:link

So if you want to make section links 'sticky' you can reference them all at once, leaving out the body id.

body.blog ul#nav a#blog:link,
body.contact ul#nav a#contact:link {
  background-color: red;
}

Check out more on CSS selectors.

Jarrod 2010-02-21 19:28:41

Answer 3

+2 A:

I agree totally with Jarrod's advice, but just in case you encounter the need to process additional conditions (and want to avoid ugly embedded ruby in your HTML code), take a look at Rails' content_tag method.

With it, you can replace something like:

<li class=<%= @post.active? ? 'active' : 'suspended' %>>
  <%= link_to @post.name, post_path(@post) %>
</li>

With something like:

<%= content_tag :li, link_to(@post.name, post_path(@post), :class => @post.active? ? 'active' : 'suspended' %>

And of course, sticking this code into a helper and calling it from there will earn you more elegance-points.

Hope this helps.

PS: This is my first post on Stackoverflow, please be gentle. :)

nicosuria 2010-02-22 09:40:48

Nice! I was wanting to be able to create an li tag and use the :class => syntax, but didn't know how to do it. That's great

NotDan 2010-02-22 17:44:55

ansaurus

tags:

views:

answers:

How can i conditionally style a <li> in rails?

related questions