Bootstrap下拉菜单在Rails中不起作用

时间:2014-03-30 15:43:50

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

我正在尝试在我的Rails应用程序中实现下拉菜单。我已经复制了正确的代码以显示下拉菜单,但是当我尝试单击菜单时,它没有显示正确的选项。

使用bootstrap cdn:

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Idealprospects</title>
  <%= stylesheet_link_tag    "application", media: "all", "data-turbolinks-track" => true %>
  <%= javascript_include_tag "application", "data-turbolinks-track" => true %>
  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
  <%= csrf_meta_tags %>
</head>
<body>

index.html.erb

<div class="container">
<h1>Your Prospects</h1>
<table class="table table-striped table-bordered">
    <tr>
      <th class="center">Company</th>
      <th class="center">Name</th>
      <th class="center">Email</th>
      <th class="center">Telephone</th>
      <th class="center">Website</th>
      <th class="center">Action</th>
    </tr>

    <% @posts.each do |post| %>
      <tr>
        <td><%= post.company %></td>
        <td><%= post.contact %></td>
        <td><%= post.email %></td>
        <td><%= post.telephone %></td>
        <td><%= post.website %></td>
        <td>
            <div class="btn-group">
               <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
                Action <span class="caret"></span>
               </button>

            <ul class="dropdown-menu" role="menu">
              <li><%= link_to 'Show', post, class: "btn btn-link" %></li>
              <li><%= link_to 'Edit', edit_post_path(post), class: "btn btn-link" %>
              <li><%= link_to 'Destroy', post, method: :delete, data: { confirm: 'Are you sure?' }, class: "btn btn-link" %> </li>
            </ul>
            </div>
        </td>
      </tr>
    <% end %>
</table>

<br>

<%= link_to 'New Post', new_post_path, class: "btn btn-link" %>

</div>

1 个答案:

答案 0 :(得分:2)

从你的代码我看到你只包含bootstrap.css,但它还需要js

http://getbootstrap.com/components/#dropdowns

<强> Dropdowns的

  

用于显示链接列表的可切换的上下文菜单。制作   使用下拉JavaScript 插件进行互动。