Rails上的Bootstrap下拉菜单,辅助方法绕过链接

时间:2017-02-22 11:42:51

标签: html ruby-on-rails twitter-bootstrap

我正在尝试使用Rails中的帮助方法添加下拉菜单,但是当我在下拉列表中有链接的ul时,它会绕过我的下拉链接标记...

application_helper.rb

  def nav_bar(c='nav nav-pills')
    content_tag(:ul, class: "#{c}") do
      yield
    end
  end

  def nav_dropdown(text)
    html_options = {data: {toggle:"dropdown"}, class:"dropdown-toggle", role:"button", aria:{haspopup:"true", expanded:"false"}}
    content_tag(:li, role:"presentation", class:"dropdown") do
      link_to raw(text + content_tag(:span, "",class:"caret")   ),"#", html_options
      nav_bar('dropdown-menu') do yield end

    end
  end

_menu.html.erb

  <%= nav_bar do %>
    ...

<% if current_user.admin? %>
    <%= nav_link t('menu.list_companies'), companies_path %>
    <%= nav_dropdown t('menu.configurations') do %>
     <%= nav_link t('menu.edit_process_types'), process_types_path %>
    <% end %>

<% end %>
当我有导航栏行nav_bar('dropdown-menu') do yield end

时生成

html

    <li role="presentation" class="dropdown">
      <ul class="dropdown-menu">
        <li><a data-method="get" href="/process_types"><span class="translation_missing" title="translation missing: pt.menu.edit_process_types"> Edit Process Types</span></a>
        </li>
      </ul>
    </li> 
当我从帮助方法

中删除导航栏行nav_bar('dropdown-menu') do yield end时生成的

html

<li role="presentation" class="dropdown">
  <a data-toggle="dropdown" class="dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" href="#">
    Configurações<span class="caret"></span>
  </a>
</li> 

我想要达到:

<li role="presentation" class="dropdown">
  <a data-toggle="dropdown" class="dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" href="#">
    Configurações<span class="caret"></span>
  </a>
  <ul class="dropdown-menu">
     <li><a data-method="get" href="/process_types"><span class="translation_missing" title="translation missing: pt.menu.edit_process_types"> Edit Process Types</span></a>
     </li>
   </ul>
</li> 

关于这里发生了什么以及如何实现预期结果的任何想法?

1 个答案:

答案 0 :(得分:0)

注意到content_tag仅输出最后一行。 然后我发现了这个:rendering text and html in a block of content_tag,在那里我看到了一种可行的方法。

最后,我用

更改了application_helper.rb
  def nav_dropdown(text)

    html_options = {data: {toggle:"dropdown"}, class:"dropdown-toggle", role:"button", aria:{haspopup:"true", expanded:"false"}}
    content_tag(:li, role:"presentation", class:"dropdown") do

     link= link_to(raw(text + content_tag(:span, "",class:"caret")  ),"#", html_options)

     nav= nav_bar("dropdown-menu") do
        yield
       end

      link + nav
    end

  end

它最终得到了所需的html:

<li role="presentation" class="dropdown">
  <a data-toggle="dropdown" class="dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" href="#">
  Configurações <span class="caret"></span>
  </a>
  <ul class="dropdown-menu">
          <li class="active"><a data-method="get" href="/process_types">Processos Modelo</a>
          </li>
  </ul>
</li>