datatables表格插件的简单使用

###Datatables表格插件

Datatables是一款jquery表格插件。它是一个高度灵活的工具，可以将任何HTML表格添加高级的交互功能。

• 分页，即时搜索和排序
• 几乎支持任何数据源：DOM， javascript， Ajax 和 服务器处理
• 支持不同主题 DataTables,jQuery UI, Bootstrap, Foundation
• 各式各样的扩展: Editor, TableTools, FixedColumns ……
  ###需要引入的文件

css文件：http://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css
js文件：http://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js
###代码实例

<table  id="table" class="table table-border table-bordered table-bg table-hover table-sort">
</table>
//初始化table
$(document).ready(function() {
		//请求获取数据
		$.post('{:U('Admin/Count/countxiao')}',{},function(data){
			var kuhulist=new  Array();
			for(var i=0;i<data.length;i++){
				var a=new  Array();
				//alert(data[i]['jian_name']);
				a[0]=data[i]['user_id'];
				a[1]=data[i]['user_name'];
				a[2]=data[i]['lou_name'];
				a[3]=data[i]['junjia'];
				a[4]=data[i]['gen_class_name'];
				a[5]=data[i]['fan_money'];
				a[6]=data[i]['is_put']==0?"否":"是";
				a[7]=data[i]['opera_time'];
				kuhulist[i]=a;
			}
			//table1 =;范围范围，地区，楼盘，推荐人，经纪人，跟进项目，项目金额，跟进状态，是否返佣，佣金
			$('#table').DataTable( {
				"data": kuhulist,
				"columns": [
					{ "title": "编号" },
					{ "title": "推荐人"},
					{ "title": "推荐项目"},
					{ "title": "项目金额" },
					{ "title": "跟进状态" },
					{ "title": "佣金金额" },
					{ "title": "是否返佣" },
					{ "title": "推荐时间"}
				]
			} );
		});
	    } );
 //按条件搜索后重新加载table
  var dttable = $('#table').dataTable();
  dttable.fnClearTable(); //clear table
  dttable.fnDestroy(); //destroy datatables