Datatables: 隐藏搜索框和底部分页栏文字等
在使用Datatables插件创建可进行自定义灵活分类查询的表格时,需要关闭自带的搜索框、分页栏等,可以参考官方文档做出如下设置:
例我们有一个下列表格实例:
<table class="all-ssl-table">
<tbody>
<tr>
<td>TrustOcean DV SSL Certificate</td>
<td>$5.15</td>
<td>$9.15</td>
</tr>
<tr>
<td>TrustOcean Wildcard SSL Certificate</td>
<td>$35.15</td>
<td>$59.15</td>
</tr>
</tbody>
</table>
使用 Datatables 进行配置:
var table = $('.all-ssl-table').DataTable({
"searching" : false, //去掉搜索框方法一
"bFilter": false, //去掉搜索框方法二
"bSort": false, //禁止排序
"paging": false, //禁止分页
"info": false //去掉底部文字
});
又因我们项目需要,需要启用搜索和Filter功能,且不需要展示搜索框,因此我们做出了如下改动:
table = $('.all-ssl-table').DataTable({
"searching" : true, //开发搜索
"bFilter": true, //开启规则搜索
"bSort": false, //禁止排序
"paging": false, //禁止分页
"info": false //去掉底部文字
});
然后我们增加了一段 css 代码来隐藏搜索框:
<style type="text/css">
.dataTables_filter{
display: none;
}
</style>
如果想查询更多关于 Datatables 的 API 文档,您可以参考官方文档 https://datatables.net/manual/api