Question

AdminLTE2数据表功能完美无缺。但样式并未应用于数据表。这是我的代码，

在Master刀片中：

@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文件。在您的子视图中尝试此操作：

@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

Admin LTE2 Datatables样式不起作用

1 个答案: