dataTables去掉搜索框和每页多少条框体 DataTables warning: table id=DataTables_Table_0 - Cannot reinitialise DataTa

html

<table class="table table-striped table-bordered table-hover text-center dataTable">
	<thead>
		<tr>
			<th data-field="create_date" class="text-center">日期</th>
			<th data-field="new_user_count" class="text-center">新增用户</th>
		</tr>
	</thead>
	<tbody></tbody>
	<tfoot></tfoot>
</table>

js

var dataTable=$('.dataTable').DataTable({
	language: {
       	"sProcessing":   "处理中...",
	    "buttons.copy":   "复制",
	    "buttons.print":   "打印",
	    "sLengthMenu":   "显示 _MENU_ 项结果。",
	    "sZeroRecords":  "没有匹配结果",
	    "sInfo":         "显示第 _START_ 至 _END_ 项结果,共 _TOTAL_ 项",
	    "sInfoEmpty":    "显示第 0 至 0 项结果,共 0 项",
	    "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
	    "sInfoPostFix":  "",
	    "sEmptyTable":     "表中数据为空",
	    "sLoadingRecords": "载入中...",
	    "sInfoThousands":  ",",
	    "oPaginate": {
	        "sFirst":    "首页",
	        "sPrevious": "上页",
	        "sNext":     "下页",
	        "sLast":     "末页"
	    },
	    "oAria": {
	        "sSortAscending":  ": 以升序排列此列",
	        "sSortDescending": ": 以降序排列此列"
	    }
    },
	serverSide: false,//分页,取数据等等的都放到服务端去
	processing: false,//载入数据的时候是否显示“载入中”
	order:[[0,"asc"]],
	autoWidth:false,//自动宽度
	pageLength: 10,
	responsive: true,
	serverSide: false,//服务器模式,使用ajax必须开启
	bPaginate: true,//分页总开关
	bLengthChange:false,//去掉每页多少条框体 
	pagingType:"full_numbers",//分页样式
	searchable:false,//搜索总开关
	searching:false,//去除搜索框
	ordering:true,//排序总开关
	columnDefs: [
	    	{
	    		"title": "日期",
	    		 "name": "create_date",
	    		 "data": "create_date",
	    		 "targets": [0],
	    		 "orderable": true,
	    		 "orderData": [0]
	    	},
	        {
	    		 "title": "活跃用户",
	    		 "name": "active_user_count",
	    		 "data": "active_user_count",
	    		 "targets": [1],
	    		 "orderable": true,
	    		 "orderData": [1]
            }
	    		],
	destroy:true,
	data: data,
	infoCallback: function(settings,start,end,max,total,pre) {
	    		                var api = this.api();
	    		                var pageInfo = api.page.info();
	    		                return "共"+pageInfo.pages +"页,当前显示"+ start + "到" + end + "条记录" + ",共有"+ total + "条记录";
	    		            }
	    		        });

js中的data数据

{
	"result": 1,
	"message": "成功",
	"data": [{
		"new_user_count": 1790,
		"active_user_count": 6777,
		"total_user_count": 103306,
		"create_date": "2019-07-08"
	}, {
		"new_user_count": 3790,
		"active_user_count": 6777,
		"total_user_count": 103306,
		"create_date": "2019-07-09"
	}, {
		"new_user_count": 1790,
		"active_user_count": 6777,
		"total_user_count": 103306,
		"create_date": "2019-07-14"
	}]
}

显示效果

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值