ajax调用后没有加载引导表css

Question

在我通过 Ajax 调用后，我无法将 CSS 加载到 bootstrap-table。

这个表被 Ajax 附加到我的视图中，用于触发每个点击事件，但引导表 CSS 尚未加载到每个表中：

<div id="sala_2">
  <h3>Sala 2</h3>
  <table id="tb_sala_2"
     data-toggle="table"
     data-toolbar="#toolbar"
     data-click-to-select="true"
     data-single-select="true">
    <thead>
      <tr>
        <th data-field="state" data-checkbox="true" data-halign="center" data-align="center"></th>
        <th data-field="id" data-halign="center" data-align="center">ID</th>
        <th data-field="cargo_id" class="hidden_field" data-halign="center" data-align="center">Cargo ID</th>
        <th data-field="cargo" data-halign="center" data-align="center">Cargo</th>
        <th data-field="quantidade_de_candidatos" data-halign="center" data-align="center">Quantidade de candidatos</th>
      </tr>
    </thead>
    <tbody>
        <% i = 0 %>
        <% @cargos.each do |cargo| %>
          <tr>
            <td></td>
            <td><%= i %></td>
            <% i = i + 1 %>
            <td class="hidden_field"><%= cargo.id %></td>
            <td><%= cargo.nome %></td>
            <td class="quantidade_de_candidatos"> 0 </td>
          </tr>
       <% end %>
   </tbody>
 </table>
</div>

Application.js：

//= require jquery
//= require jquery_ujs
//= require bootstrap-table
//= require turbolinks  
//= require_tree .

Application.css：

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

观察：第一次加载页面时，bootstrap-table CSS 已经正确加载。当我使用 ajax 附加另一个表时会出现问题。所以，我认为问题在于 Rails 加载资产的方式。

Answer 1

我能够解决在 Ajax 成功函数中调用此方法的问题：

$('#table').bootstrapTable();

这样，gem 中的默认方法和样式就被填充了。

Answer 2

您可以尝试异步使用 loadCss.js 库。

githttps://github.com/filamentgroup/loadCSS

用法：loadCSS( "path/to/mystylesheet.css" );