DataTable 基础使用

html部分：

 

	

		

			
id
			
姓名
			
类型
			
微信号
			
手机号
			
操作
		
	
	

	                
	

js部分：

   var table = $("#mytable");
    window.dataTable = table.DataTable({
      //汉语语言包
      "language": {
        "url": "../../datatables_language.json"
      },
       // 是否开启本地分页
      "paging": true,
      // 是否开启本地排序
      "ordering": false,
      // 是否显示左下角信息
      "info": true,
      // 是否允许用户改变表格每页显示的记录数
      "lengthChange": false,
      // 是否显示处理状态(排序的时候，数据很多耗费时间长的话，也会显示这个)
      "processing": true,
      // 是否允许 DataTables 开启本地搜索
      "searching": true,
      // 控制 DataTables 的延迟渲染，可以提高初始化的速度
      "deferRender": true,
      // 分页按钮显示选项
      "pagingType": "full_numbers",
      //启用分页时,此选项将控制一个选项的显示终端用户更改每页显示的记录数。所示的选项由lengthMenu控制配置选项列表。
      "lengthChange": true,
      "lengthMenu": [ [10, 25, 50, -1], [10, 25, 50, "所有"] ],
      //"dom": '<"toolbar">frtip',
      // 是否开启服务器模式
      "serverSide": true,
      //ajax请求
      "ajax": {
        "url": "/choujiang/public/index.php/admin/Admin/list",
        "type":"POST",
      },
      //列数据
      "columns": [
        {"data": "id"},
        {"data": "name"},
        {"data": "position",
          "render" : function(data, type, full, meta){
              return data == 1 ? '系统管理员' : '授权管理员';
          }
        },
        {"data": "wechat"},
        {"data": "phone"},
        {"data": function(data){
                return "编辑  删除";
            }
        },
      ],
      //加入跳转到第某页功能
      "fnDrawCallback": function() {  
        $("#mytable_paginate").append("
到第  页 确认
");  
        var oTable = table.dataTable();  
        $('#dataTable-btn').click(function(e) {  
          if($("#changePage").val() && $("#changePage").val() > 0) {  
                var redirectpage = $("#changePage").val() - 1;  
           } else {  
              var redirectpage = 0;  
           }  
            oTable.fnPageChange(redirectpage);  
        });  
      },
    });

汉语语言包：
datatables_language.json 内容

{
  "sProcessing": "处理中...",
  "sLengthMenu": "显示 _MENU_ 项结果",
  "sZeroRecords": "没有匹配结果",
  "sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
  "sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",
  "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
  "sInfoPostFix": "",
  "sSearch": "搜索:",
  "sUrl": "",
  "sEmptyTable": "表中数据为空",
  "sLoadingRecords": "载入中...",
  "sInfoThousands": ",",
  "oPaginate": {
   "sFirst": "首页",
   "sPrevious": "上页",
   "sNext": "下页",
   "sLast": "末页"
  },
  "oAria": {
    "sSortAscending": ": 以升序排列此列",
    "sSortDescending": ": 以降序排列此列"
  }
}