我正在使用jQuery数据表。
我想删除默认情况下添加到表中的搜索栏和页脚(显示有多少行可见)。我只是想用这个插件来排序。这能做到吗?
我正在使用jQuery数据表。
我想删除默认情况下添加到表中的搜索栏和页脚(显示有多少行可见)。我只是想用这个插件来排序。这能做到吗?
当前回答
请访问http://www.datatables.net/examples/basic_init/filter_only.html查看要显示/隐藏的特性列表。
你想要的是将“bFilter”和“bInfo”设置为false;
$(document).ready(function() {
$('#example').dataTable( {
"bPaginate": false,
"bFilter": false,
"bInfo": false
} );
} );
其他回答
请访问http://www.datatables.net/examples/basic_init/filter_only.html查看要显示/隐藏的特性列表。
你想要的是将“bFilter”和“bInfo”设置为false;
$(document).ready(function() {
$('#example').dataTable( {
"bPaginate": false,
"bFilter": false,
"bInfo": false
} );
} );
正如@Scott Stafford所说,sDOM是最适合显示、隐藏或重新定位组成数据表的元素的属性。我认为sDOM现在已经过时了,在实际的补丁中,这个属性现在是dom。
这个属性还允许为一个元素设置一些类或id,所以你可以更容易地设计风格。
查看官方文档:https://datatables.net/reference/option/dom
这个例子只显示表:
$('#myTable').DataTable({
"dom": 't'
});
我认为最简单的方法是:
<th data-searchable="false">Column</th>
你可以只编辑你必须修改的表,而不改变常见的CSS或JS。
如果你正在使用自定义过滤器,你可能想隐藏搜索框,但仍然想启用过滤器功能,所以bFilter: false不是方法。使用dom: 'lrtp'代替,默认是'lfrtip'。文档:https://datatables.net/reference/option/dom
从DataTables 1.10.5开始,现在可以定义初始化了 选项使用HTML5 data-*属性。
- datatables文档:HTML5数据-*属性-表选项
所以你可以在表上指定data-searching="false" data-分页="false" data-info="false"。例如,该表将不允许搜索、应用分页或显示信息块:
<table id="example" class="display" width="100%" data-searching="false" data-paging="false" data-info="false">
<thead>
<tr>
<th>Name</th>
<th data-orderable="false">Avatar</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td><img src="https://www.gravatar.com/avatar/8edcff60cdcca2ad650758fa524d4990?s=64&d=identicon&r=PG" alt="" style="width: 64px; height: 64px; visibility: visible;"></td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>Garrett Winters</td>
<td><img src="https://www.gravatar.com/avatar/98fe9834dcca2ad650758fa524d4990?s=64&d=identicon&r=PG" alt="" style="width: 64px; height: 64px; visibility: visible;"></td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
...[ETC]...
</tbody>
</table>
在https://jsfiddle.net/jhfrench/17v94f2s/上查看一个实际示例。
这种方法的优点是它允许你有一个标准的dataTables调用(例如,$('table.apply_dataTables'). datatable()),同时能够逐表配置dataTables选项。