2011-08-27 158 views
1

我在application.html中有我的導航菜單,菜單中有class =「active」。這取決於用戶所在的頁面。我怎樣才能動態地找出哪些項目需要有類:導軌導航菜單

這裏是我的頂部菜單欄是如何:

<ul> 
    <li class="active"><a href="#">Home</a></li> 
    <li><a href="#">Page1</a></li> 
    <li><a href="#">Page2</a></li> 
    <li><a href="#">Page3</a></li> 
</ul> 
+1

這或許SO [問題](http://stackoverflow.com/q/1751863/22371)將幫助或查看[Tabs on Rails](http://github.com/weppos/tabs_on_rails)gem。 – kafuchau

回答

2

一種方法是在控制器的@active_page實例變量,你設置每個動作。你也可以用一個標題(@title也許?)來做到這一點,所以也許你可以使用它。然後在模板:

<li class="<%= "active" if @active_page == "Home" %>">...</li> 
+0

'@ controller.controller_name'和'@ controller.action_name'會更好嗎? – hachpai

+0

@hachpai - 這是另一種方式來做到這一點! – brentvatne

1

最簡單的(也可能是最起碼的)是使用current_page?。你可以read up in the docs看看它是如何工作的。由於I've experienced,它並不總是產生你想要的。

還有一個寶石,navigasmic,如果您的需求相當複雜,它可以很好地工作。

有很多方法可以完成您正在嘗試做的事情。首先嚐試current_page?,如果你發現自己抓住你的頭髮,繼續前往navigasmic。

+0

我一直在我的ide情報中看到當前頁面,但從來不知道它是 – Uchenna

0

您可以創建一個賽普爾助手這樣

def nav_link(name, url) 
    selected = url.all? { |key, value| params[key] == value } 
    link_to(name, url, :class => (selected ? "youarehere tabs" : "tabs")) 
    end 

<div id="tabs" class="tabs2"> 
    <%= nav_link %> 
    <%= nav_link %> 
    <%= nav_linl %> 
</div> 

然後添加必要的CSS樣式