Bootstrap 3 modal error with Rails 4

Question

I am trying to display a modal that includes an object's information. I am running Rails 4, and Bootstrap 3. I followed an example on SO and have received an error:

Sprockets::FileNotFound in Gifts#index
couldn't find file 'bootstrap-modal'

My Gemfile looks like this:

gem 'rails', '4.0.0'
gem 'bootstrap-sass', '3.0.2.0'
gem 'activeresource'

group :assets do
    gem 'jquery-ui-rails'
    gem 'jquery-modal-rails'
end 

group :development, :test do
    gem 'sqlite3', '1.3.8'
    gem 'rspec-rails', '2.13.1'
end

group :test do
    gem 'selenium-webdriver', '2.35.1'
    gem 'capybara', '2.1.0'
    gem 'factory_girl_rails', '4.2.1'
end

gem 'sass-rails', '4.0.1'
gem 'uglifier', '2.1.1'
gem 'coffee-rails', '4.0.1'
gem 'jquery-rails', '3.0.4'
gem 'turbolinks', '1.1.1'
gem 'jbuilder', '1.0.2'
gem 'devise'
gem 'activeadmin', github: 'gregbell/active_admin'
gem 'paperclip'
gem 'aws-sdk'
gem 'rmagick', '2.13.2'
gem 'stripe', :git => 'https://github.com/stripe/stripe-ruby'


group :doc do
    gem 'sdoc', '0.3.20', require: false
end

group :production do
    gem 'pg', '0.15.1'
    gem 'rails_12factor', '0.0.2'
end

Application.js

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

$(document).ready(function() {
   $('#modal-window').modal('show');
   $('.modal-body').html('<%= escape_javascript(render :partial => "recipient_data", :object =>  @gift) %>'); 
});

Show.html.erb

<div class="modal hide fade" id="modal-window">
<div class="modal-header">
  <a href="#" class="close">×</a>
</div>

<div class="modal-body center">
<h2>Hello, World</h2>
<%= render 'charges/recipient_data' %>
</div>

<div class="modal-footer">&nbsp;
</div>
</div>

The link to the modal on my index page

<%= link_to 'Show', gift_path(gift), {:remote => true,
'data-controls-modal' =>  "modal-window",
 'data-backdrop' => true,
 'data-keyboard' => true,
 :class => "btn btn-primary ", :id => 'show_gift'} %>

How should I load bootstrap-modal in this case?

Answer 1

The current version of bootstrap-sass uses a slightly different require line (with a / instead of a -)

//= require bootstrap/modal

However, since you're already including a //= require bootstrap, there is no need to require the modal file separately.