使用最新的bootstrap-scss＆＃39;无法正确渲染Bootstrap模型。铁轨中的宝石4

Question

我正在尝试编写Ajax代码来呈现模型表单。所以，我尝试使用web中的示例代码，这些代码是用＃boot; bootstrap-sass 2.3.2.2＆＃39;编写的，它运行正常。

但是，当我尝试使用最新版本的bootstrap-sass 3.3.0.1＆＃39; （根据bootstrap-sass配置配置），它在rails 4中不起作用。这是模型的外观。有时我看到模型根本没有启动。

以下是我的配置设置：

＆＃34;宝石＆＃34;文件：

gem 'bootstrap-sass', '~> 3.3.0'
gem 'sass-rails', '>= 3.2'
gem 'autoprefixer-rails'

＆＃34;资产/样式表/ bootstrap_config.scss＆＃34;：

@import "bootstrap-sprockets";
@import "bootstrap";

请帮我正确配置。在此先感谢

Answer 1

Bootstrap v3与Bootstrap v2不向后兼容。您需要按照官方迁移指南将您的网页移至v3：http://getbootstrap.com/migration/

在许多其他更改中，Bootstrap模式所需的HTML在v3中是不同的。

Answer 2

谢谢，

将代码迁移到v3之后，它运行正常..

旧代码（bootstrap-sass v2.3.2.2）：

<div id="productModal" class="modal fade">
    <div class="modal-header">
        <!-- Model Title -->
    </div>
    <div class="modal-body">
    <!-- Content -->
  </div>
  <div class="modal-footer">
    <!-- Footer -->
  </div>    
</div>

新（工作）代码（bootstrap-sass v3.3.0.1）：

<div id="productModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="productModalTitle" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">

        <div class="modal-header">
          <!-- Model Title -->
          <h4 class="modal-title" id="productModalTitle">Title</h4>
        </div>
        <div class="modal-body">
            <!-- Content -->
          </div>
          <div class="modal-footer">
            <!-- Footer -->
          </div>    

      /div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->