Лучший способ добавить «текущий» класс для навигации в Rails 3 - PullRequest
110 голосов
/ 14 сентября 2010

У меня есть несколько статических страниц в меню навигации. Я хочу добавить класс типа «текущий» к элементу, который отображается в данный момент.

Я делаю так, чтобы добавить тонны вспомогательных методов (каждый для одного элемента) для проверки контроллера и действия.

def current_root_class
  'class="current"' if controller_name == "homepage" && action_name == "index" 
end

<ul>
  <li <%= current_root_class %>><%= link_to "Home", root_path %>

Есть ли лучший способ сделать это !? Мой нынешний путь такой глупый ...

Ответы [ 24 ]

287 голосов
/ 13 октября 2011

Я сделал помощник с именем nav_link:

def nav_link(link_text, link_path)
  class_name = current_page?(link_path) ? 'current' : ''

  content_tag(:li, :class => class_name) do
    link_to link_text, link_path
  end
end

, используемый как:

nav_link 'Home', root_path

, который будет производить HTML как

<li class="current"><a href="/">Home</a></li>
70 голосов
/ 03 августа 2011

Используйте помощник current_page?, чтобы определить, следует ли назначать класс "current". Например:

<%= 'active' if current_page?(home_about_path) %>

Обратите внимание, что вы также можете передать путь (не только хэш опций), например: current_page?(root_path).

56 голосов
/ 14 сентября 2010

Не совсем ответ здесь, потому что я использую то же самое, что и вы.Я только что определил вспомогательные методы для тестирования нескольких контроллеров или действий:

В application_helper.rb

  def controller?(*controller)
    controller.include?(params[:controller])
  end

  def action?(*action)
    action.include?(params[:action])
  end

Затем вы можете использовать if controller?("homepage") && action?("index", "show") в своих представлениях или других вспомогательных методах…

26 голосов
/ 02 марта 2012

Я использую эту функцию nav_link (text, link) в application_helper.rb (Rails 3), чтобы выполнить свою работу, и она катит мои ссылки панели навигации загрузчика twitter 2.0 для меня.

def nav_link(text, link)
    recognized = Rails.application.routes.recognize_path(link)
    if recognized[:controller] == params[:controller] && recognized[:action] == params[:action]
        content_tag(:li, :class => "active") do
            link_to( text, link)
        end
    else
        content_tag(:li) do
            link_to( text, link)
        end
    end
end

Пример:

<%=nav_link("About Us", about_path) %>
10 голосов
/ 12 ноября 2010

Я сделал это, добавив вспомогательную функцию в application_helper

def current_class?(test_path)
  return 'current' if request.request_uri == test_path
  ''
end

Затем в nav,

<%= link_to 'Home', root_path, :class => current_class?(root_path) %>

Это проверяет путь ссылки относительно текущегоpage uri и возвращает либо ваш текущий класс, либо пустую строку.

Я не проверил это до конца, и я очень новичок в RoR (переходя через десять лет с PHP), так что если у этого есть серьезный недостатокЯ бы хотел услышать это.

По крайней мере, так вам понадобится только 1 вспомогательная функция и простой вызов в каждой ссылке.

6 голосов
/ 09 декабря 2012

Чтобы построить ответ @Skilldrick ...

Если вы добавите этот код в application.js, он будет гарантировать, что любые выпадающие меню с активными дочерними элементами также будут помечены как активные ...

$('.active').closest('li.dropdown').addClass('active');

Чтобы вспомнить вспомогательный код> Добавить помощник с именем nav_link:

def nav_link_to(link_text, link_path)
  class_name = current_page?(link_path) ? 'active' : ''

  content_tag(:li, :class => class_name) do
    link_to link_text, link_path
  end
end

используется как:

nav_link_to 'Home', root_path

, который будет производить HTML как

<li class="active"><a href="/">Home</a></li>
4 голосов
/ 17 июля 2014

Я знаю, что это устаревший ответ, но вы можете легко проигнорировать все эти проверки текущей страницы, используя вспомогательную оболочку link_to, называемую active_link_to gem, она работает именно так, как вы хотите, добавьте активный классна страницу текущей ссылки

4 голосов
/ 22 октября 2015

Вот полный пример того, как добавить активный класс на страницу меню начальной загрузки в представлении rails.

    <li class="<%= 'active' if current_page?(root_path) %>"><%= link_to 'Home', controller: "welcome" %></li>
    <li class="<%= 'active' if current_page?(about_path) %>"><%= link_to 'About us', about_path %></li>
   <li class="<%= 'active' if current_page?(contact_path) %>"><%= link_to 'Contact us', contact_path %></li>
4 голосов
/ 23 мая 2014

Я думаю, что лучший способ это

application_helper.rb:

def is_active(controller, action)       
  params[:action] == action && params[:controller] == controller ? "active" : nil        
end

и в меню:

<li class="<%= is_active('controller', 'action') %>">
3 голосов
/ 23 сентября 2010

Я использую удивительный камень под названием Tabs на Rails .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...