【问题标题】:Bootstrap dropdown menu not working in Rails引导下拉菜单在 Rails 中不起作用
【发布时间】:2014-03-31 01:02:44
【问题描述】:

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

使用引导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>

【问题讨论】:

  • RailsApps 项目有一个不错的 rails-bootstrap 示例应用程序,它将向您展示如何使用 gem 和资产管道将 Bootstrap 与 Rails 集成(推荐做法):github.com/RailsApps/rails-bootstrap
  • 好的,谢谢。

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


【解决方案1】:

从你的代码中我看到你只包含 bootstrap.css 而它也需要 js

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

下拉菜单

用于显示链接列表的可切换上下文菜单。制成 与 下拉 JavaScript 插件交互。

【讨论】:

  • cool so data-toggle="dropdown" 是必须的
  • 您好,我添加了
猜你喜欢
  • 1970-01-01
  • 2019-01-09
  • 2019-05-24
  • 2019-05-06
  • 1970-01-01
  • 2016-04-12
  • 2013-04-07
相关资源
最近更新 更多