var operationTableOption = createCommonTableOptions(); operationTableOption.ajax = { // url可以直接指定远程的json文件，或是MVC的请求地址 /Controller/Action url: "/operation/query", type: 'POST', // 异步调用 async:true, // 传给服务器的数据，可以添加我们自己的查询参数 data: function (param) { param.start = param.start; param.offset = param.length; switch (param.order[0].column) { case 1: param.sortPro = "createtime"; break; case 2: param.sortPro = "excutetime"; break; } if("asc" == param.order[0].dir) { param.sortType = 0; } else if("desc" == param.order[0].dir) { param.sortType = 1; } return param; }, //用于处理服务器端返回的数据。 dataSrc是DataTable特有的 dataFilter: function (myJson) { var result = JSON.parse(myJson); var retStr = JSON.stringify(result.data); return retStr; } };
首先，通过通用配置选项的函数获取了一个通用选项的对象operationTableOption，然后为operationTableOption设置ajax选项。
首先设置请求地址，因为ajax正常情况下是不能跨域的，所以直线后面的path就可以，然后指定请求类型为POST。设置为异步请求。定义一个拦截请求的方法设置到data属性中，这样就可以完成自己请求的定制了。
这个请求主要就是根据要排序列的序号，给服务端传递排序字段的名称以及排序方式，这样服务端就可以不用了解DT入参的数据格式，而根据接口文档开发就行了。
最后有个dataFilter属性，这里要定义一个方法拦截服务端给前端返回的json数据，将json中的data数据列表(上面说出参格式的时候提到过)给剥离出来并返回，这样一会儿定义列数据绑定的时候就可以直接使用这个列表了。
ajax选项定义完毕，下一步要定义列相关的选项,定义列可以使用 columns 和 columnDefs这两个选项都可以用来定义列，首先，这两个选项中都要放入一个Definition Object的数组，区别就是columns需要对所有的列进行定义，也就是说这个表的每一个列都要和选项中放的DeinitionObject的一个子元素对应行程映射，columnDefs可以使用target来指定某一个定义对象应用到某一列，或者某一个定义对象是全局生效的，而且允许对同一个列进行多次定义。
为了使定义更清晰、更好理解、更方便维护，我一般都是使用columns进行定义。
operationTableOption.columns = [ { "data": "operationid","orderable": false }, { "data": "createtime" , "orderable": true, "render": function ( data, type, row, meta ) { if(data > 0) return $.myTime.UnixToDate(data,true) else return "" } }, { "data": "excutetime" , "orderable": true, "render": function ( data, type, row, meta ) { if(data > 0) return $.myTime.UnixToDate(data,true) else return "" }}, { "data": "needuploadlocation","orderable": false, "render": function ( data, type, row, meta ) { if(data) { return "是"; } else { return "否"; } } }, { "data": "recordsbegindate","orderable": false }, { "data": "recordsenddate" ,"orderable": false}, { "data": "uploadsoundsids","orderable": false }, {"render":function ( data, type, row, meta ) { var operationId = row.operationid; return "<button type=\"button\"οnclick=\"deleteOperation("+ operationId +"," +meta.row+ ")\">删除</button>"; }} ];
可以看到，将后端给前端返回的出参，使用属性名依次绑定到列上，orderatble是说明这一列是否支持排序。render可以定义一个function也可以定义成其他属性，是用来转换数据的，比如返回的时间是一个时间戳，但是我要现实的是一个fomat的时间，就可以在render中转换。还有最后一行，我想在最后一列添加一个删除按钮，那这个删除按钮就可在这里通过数据的唯一索引来动态生成。
看下官方对render中使用function定义的说明：
function render( data, type, row, meta )
Description:
If a function is given, it will be executed whenever DataTables needs to get the data for a cell in the column. Note that this function might be called multiple times, as DataTables will call it for the different data types that it needs - sorting, filtering and display.
Parameters:
Name
Type
Optional
Any
1
data