学习笔记：DataTables之数据读取和操作（java对象转换为json对象）

无意中发现jquery插件中有一个用于表格的，自动分页、搜索、设置每页显示记录数，太方便了。于是尝试着去使用，可是，遇上问题了不仅一点点。
由于后台从数据库查找的数据被封装成了一个java对象（例Employee），可是，dataTables接受的数据源是javascript的数据类型，而且是一个数组，数组里面的内容可以是数组、对象、实例。我的想法是，把java对象转换为json（用gson）。
但是，问题又来了，网上大多数例子都是使用数组为例，很少使用json对象的，而且官网上的例子用起来总出问题。

//模拟数据
var aDataSet = [{
    "id": "0",
    "name": "Tiger Nixon",
    "position": "System Architect",
    "salary": "$3,120",
    "start_date": "2011/04/25",
    "office": "Edinburgh",
    "extn": "5421"                  
    }, {
    "id": "1",
    "name": "Garrett Winters",
    "position": "Director",
    "salary": "$5,300",
    "start_date": "2011/07/25",
    "office": "Edinburgh",
    "extn": "8422"
}];

如果HTML已定义好表格的第一行，而且数据和已定义的列是对应，那就绑定数据就行了，可是，通常情况下，没这么如意，我们的数据源常常有一堆我们不需要的东西。
以下是datatables官方的例子，可是我试了几次，都没办法读出数据，不知道是不是我下载的版本的问题

$('#example').DataTable( {
    data: data,
    columns: [
        { data: 'name'},
        { data: 'position'},
        { data: 'salary'},
        { data: 'office'}
    ]
} );

于是，综合网上找到的信息，最后把改成aaData:data,aoColumns:[…]就好了

"aaData": data,
"aoColumns": [
        { data: 'name'},//这里还可以用mDataProp
        { data: 'position'},
        { data: 'salary'},
        { data: 'office'}
    ]

下一个问题，由于方便结合数据库处理数据数据，当然最好保留第个对象的ID，然后每次取ID去数据库操作就可以了。于是，把第一列设置为ID列，并隐藏它，最后添加一列用来放控件

columnDefs": [ {
    "targets": -1, //最后一列添加删除按键
    "data": null,
    "defaultContent": "'delrow' class='btn btn-primary' type='button'>delete",//自定义内容
    }, {
    "targets": 0, //第一列隐藏
    "data":"id",
    "visible": false,//不可见
    "searchable": false
    }]

最后一列添加了一个按键，那么，每次点击按键，怎么取得这一行的对象的ID？
我们设置了第一列为ID列，因此，只需获取所选那一行第一个数据就行了，方法如下：

$('.dataTables-example tbody').on( 'click', 'button#delrow', function () {
    var data = tables.row( $(this).parents('tr') ).data();//所选择的行的数据
    alert(data.id);//测试
    //网上的例子多数是用data[0]的方法，因为我的数据源是由java对象得到的json，所以直接用操作对象的方法
});