我的datatable定义如下:
<html><body>
<head>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css">
</head>
<body>
<table class="table responsive table-togglable table-hover">
<thead>
<tr>
<th data-toggle="true">ID</th>
<th >Usuario</th>
<th >Objeto</th>
<th >Id del Objeto</th>
<th class="none">Antes</th>
<th class="none">Despues</th>
<th >type</th>
<th >Creación</th>
<th >Actualización</th>
</tr>
</thead>
<tbody>
<tr>
<td>2165</td>
<td> - </td>
<td>PersonReferences</td>
<td>3802973</td>
<td> - </td>
<td> Large Text </td>
<td>created</td>
<td>2016-05-11 17:07:23</td>
<td>2016-05-11 17:07:23</td>
</tr>
</tbody>
</table>
<script src="http://rh.dev/assets/materialize/js/jquery-1.11.2.min.js"></script>
<script src="http://rh.dev/assets/js/datatables/datatables.min.js"></script>
<script src="http://rh.dev/assets/js/datatables/extensions/responsive.min.js"></script>
<script>
$('.table-togglable').DataTable({
responsive: true
});
</script>
归入&#34;无&#34;的2列。作品。当我点击行时,它会显示这两个长值。
我可以看到四个第一列,第五列的一半,我看不到所有其他列。
知道发生了什么???
编辑:
这是我生成的标签:
<table class="table responsive table-togglable table-hover dataTable no-footer dtr-inline collapsed" id="DataTables_Table_0" role="grid" aria-describedby="DataTables_Table_0_info" style="width: 2446px;">
答案 0 :(得分:1)
错误在您的HTML中,您缺少标记tbody
,请更改您的代码......
<table class="table responsive table-togglable table-hover">
<thead>
<tr>
<th data-toggle="true">ID</th>
<th >user</th>
<th >object_type</th>
<th >object_id')</th>
<th class="none">old_value</th>
<th class="none">new_value</th>
<th >type</th>
<th >created_at</th>
<th >updated_at</th>
</tr>
</thead>
<tbody>
@foreach($logs as $log)
<tr>
<td>text</td>
<td>text</td>
<td>text</td>
<td>text</td>
<td> text </td>
<td>text </td>
<td>text</td>
<td>{{ $log->created_at }}</td>
<td>{{ $log->updated_at }}</td>
</tr>
@endforeach
</tbody>
</table>
<强>更新强>
如果您使用responsive: true
,则应该导入css响应
https://cdn.datatables.net/responsive/2.0.2/css/responsive.dataTables.min.css