jquery - Admin LTE2 数据表样式不起作用

Question

AdminLTE2 数据表功能完美运行。但样式不适用于数据表。这是我的代码，

在主 Blade 中:

@if(config('adminlte.plugins.datatables'))
    <!-- DataTables -->
 <link rel="stylesheet" type="text/css" 
         href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css">
 @endif

 In my child blade,
      @section('content')
             <div class="box-body">
          <table id="example2" class="table table-bordered table-hover">
            <thead>
            <tr>
              <th>Rendering engine</th>
              <th>Browser</th>
              <th>Platform(s)</th>
              <th>Engine version</th>
              <th>CSS grade</th>
            </tr>
            </thead>
            <tbody>
            <tr>
              <td>Trident</td>
              <td>Internet
                Explorer 4.0
              </td>
              <td>Win 95+</td>
              <td> 4</td>
              <td>X</td>
            </tr>
            <tr>
              <td>Trident</td>
              <td>Internet
                Explorer 5.0
              </td>
              <td>Win 95+</td>
              <td>5</td>
              <td>C</td>
            </tr>                       
            </table>
        </div>
  @stop
 @section('adminlte_js')
 <script>
   $(function () {
 $("#example1, #example2").DataTable();
});
</script>
 @stop

链接的 css 文件有什么问题吗？谁能帮我解决这个问题？

Answer 1

您必须包含 Bootstrap js 和 css 文件。在您的 subview 中试试这个:

@section('adminlte_css')
    <link rel="stylesheet" type="text/css" 
                 href="//cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css">
@stop

@section('content')
  ...
@stop

@section('adminlte_js')
    <script src="//cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>
    <script>
        $(function () {
            $("#example1, #example2").DataTable();
        });
    </script>
@stop