Bootstrap 模态插件无法正常工作答案

【问题标题】：Bootstrap Modal Plugin is not working properlyBootstrap 模态插件无法正常工作
【发布时间】：2018-12-03 08:02:22
【问题描述】：

我正在使用引导模式，我想在我的 pop 中列出员工详细信息，但那不能正常工作。

index.html.erb

     <a href="#" data-toggle="modal" data-target="#myModal-<%= current_user.id %>"> 
                                 <%= image_tag("view.png",:size=>"30x30") %></a></td>
                                 </tr>
                                <div class="modal fade" id="myModal-<%= current_user.id %>" role="dialog">
                                    <div class="modal-dialog">
                                      <div class="modal-content">
                                        <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">&times;</button>
                              <div class="modal-body">        
                <strong>RollID:</strong>
                <%= current_user.roll_id %>
            </div>

application.html.erb

<title>EmployeeManagementSystem</title>
<%= csrf_meta_tags %>

<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_link_tag 'https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css' %>
<%= stylesheet_link_tag "https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700|Material+Icons" %>
<%= javascript_include_tag "http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"%>
   <%= yield %>

应用程序.js

//= require activestorage
//= require jquery.validate
//= require jquery.validate.additional-methods
//= require rails-ujs
//= require turbolinks
//= require jquery
//= require jquery_ujs
//= require popper
//= require_tree .

宝石文件https://imgur.com/a/RxWpe8v
请告诉我代码中的任何错误。有另一种方式来实现模态电话。谢谢提前

【问题讨论】：

不能正常工作是什么意思？会发生什么？
你的应用中是否有 bootstrap.js ？
嗨，Divya，不知道会发生什么，很难告诉你问题是什么并解决它。

标签： ruby-on-rails ruby-on-rails-4 rubygems ruby-on-rails-5 bootstrap-modal

【解决方案1】：

您需要将引导组件或 bootstrap-sprockets.js 包含到您的 app/assets/javascripts/application.js 文件中。由于 bootstrap 依赖于 jquery，所以我会放在 jquery 之后。

//= require jquery
//= require bootstrap-sprockets

【讨论】：