css - select2 rails 下拉菜单无法正确呈现

Question

我能够让 select2-rails 在大多数情况下工作，但是当我点击搜索栏时，我得到以下信息：

我正在使用以下 CoffeeScript：

    $('#query').select2({
            placeholder: placeholder_text
            minimumInputLength: 2
            ajax:
                    url: end_point
                    tags: "false",
                    dataType: 'json',
                    delay: 200,
                    cache: true,
                    data: (params) ->
                            return { search: params.term.toUpperCase() }
                    processResults: (data, params) ->
                            return { results: data }
            theme: "bootstrap"
    })

以及以下 HTML：

<div class="col-md-6 text-right">
   <form>
      <%= select_tag "search", {}, id: "query" %>
    </form>
</div>

应用程序.css

 *= require select2                                                                                 
 *= require select2-bootstrap                                                                       
 *= require_tree .                                                                                  
 *= require_self 

应用程序.js

//= require jquery                                                                                  
//= require jquery.turbolinks                                                                       
//= require jquery_ujs                                                                              
//= require bootstrap                                                                               
//= require turbolinks                                                                              
//= require select2                                                                                 
//= require_tree .    

正如我所说，我可以很好地查询，我只是希望搜索栏正确对齐......

有没有人有任何想法？

Answer 1

这是 trh 评论的扩展，因为它让我走上了正确的道路。

将 select2 与 bootstrap 一起使用时，位于 assets/stylesheets/application.scss 中的此代码为我修复了所有问题

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