Rails:下拉菜单

时间:2012-06-29 15:56:50

标签: ruby-on-rails drop-down-menu menu

环境:Rails 3.2.3

我正在编辑此问题以包含帮助程序模块的源代码以及此处的建议:

这是我第一次尝试在Rails应用程序中执行下拉菜单。我尝试在这个主题上寻求帮助,但是复杂的事情是术语下拉菜单用于实际下拉菜单(页面菜单),以及问题中的下拉列表,表单选项,表单选择等等,以及论坛,很难找到我正在寻找的信息。

我找到了一个指向https://github.com/dkeskar/rails-jquery-dropdown的指针,(帖子末尾的源代码)并按照说明,我下载了jquery_dropdown_helper.rb:)并将其放在/ lib

在我的Gemfile中,我有以下内容:

gem 'jquery-rails'

在_header.html.erb中,我有以下内容:

<% require 'jquery_dropdown_helper' %>
....
<%= hidden_field_tag :sort_criteria %>
<%= dropdown_tags :sort_criteria, 'Select Criteria',
    %w(Category Status Amount-High Amount-Low) %>

但这不起作用。这是我得到的错误代码:

undefined method `gsub' for :sort_criteria:Symbol

我查看了跟踪,似乎jquery_dropdown_helper.rb中的这一行是问题所在:

id = options[:id] || "#{field.gsub(/[[]\s]/, '-')}-selector"

有什么想法吗?

解决下拉菜单问题的解决方案

我一直在寻找一种在我的rails应用程序中使用下拉菜单的方法,但无法得到这个问题的答案。经过几天的研究,我确实找到了一个解决方案,使用Twitter宝石'twitter-bootstrap-rails'。

将以下内容添加到您的Gemfile:

gem 'twitter-bootstrap-rails'

将以下内容添加到您的app / assets / javascripts / application.js

确保按照这个确切的顺序:

//= require jquery
//= require jquery_ujs
//= require_tree .
//= require bootstrap

然后,在您需要下拉菜单的位置,添加以下内容:

          <ul class="nav nav-pills">
            <li class="dropdown" id="admin_menu">
              <a class="dropdown-toggle" data-toggle="dropdown" href="#admin_menu">
                ADMIN
              </a>
              <ul class="dropdown-menu">
                <% Admin_menu.each do |menu_text,menu_action| %>
                    <li><a href=" <%= menu_action %>"><%= menu_text %></a></li>
                <% end %>
              </ul>
            </li>
          </ul>

请注意,我有以下哈希:

Admin_menu = Hash.new
Admin_menu["Events"] = "events#index"
Admin_menu["Categories"] = "categories#index"
Admin_menu["Panels"] = "panels#index"  

假设你有以下脚手架:事件,类别和面板,它应该全部工作

1 个答案:

答案 0 :(得分:0)

jquery_dropdown_helper.rb不提供名为sort_criteria的方法。我认为这个例子应该是:

<% require 'jquery_dropdown_helper' %>
....
<%= hidden_field_tag :sort_criteria %>
<%= dropdown_tags :sort_criteria, 'Select Criteria',
    %w(Category Status Amount-High Amount-Low) %>

:sort_criteria只是表单元素的名称,可以是符号或字符串(即:sort_criteria或'sort_criteria')