对象数据源
DataTables 期望服务器端处理的默认数据格式是一个2D数据数据(行和列)。 但是,这对于服务器端环境通常不够灵活,或者您可能希望在数据源中添加比在 table 中显示所需的更多信息(如数据库中的行ID)。对于这些情况,DataTable 支持读取对象以及数组的数据。)
本示例演示服务器使用对象数组进行响应,其中 DataTables 将查找并使用由为每列指定的
columns.data
属性指定的每个属性。
姓名 | 职位 | 工作地点 | 年龄 | 入职时间 | 年薪 |
---|---|---|---|---|---|
姓名 | 职位 | 工作地点 | 年龄 | 入职时间 | 年薪 |
$('#dataTableExample').DataTable($.concatCpt('dataTable', {
"processing": true,
"serverSide": true,
"ajax": "/employee/all/get",
"columns": [
{"data": "name"},
{"data": "title"},
{"data": "base"},
{"data": "age"},
{"data": "hireDate"},
{"data": "salary"}
]
}));
<table class="table table-bordered table-hover dataTable table-striped w-full">
<thead>
<tr>
<th>姓名</th>
<th>职位</th>
<th>工作地点</th>
<th>年龄</th>
<th>入职时间</th>
<th>年薪</th>
</tr>
</thead>
<tfoot>
<tr>
<th>姓名</th>
<th>职位</th>
<th>工作地点</th>
<th>年龄</th>
<th>入职时间</th>
<th>年薪</th>
</tr>
</tfoot>
</table>
java代码
{
"recordsFiltered": 57,
"data": [
{
"name": "李霞",
"title": "系统架构师",
"base": "北京",
"age": 61,
"hireDate": "2011/04/25",
"salary": 320800,
"DT_RowId": 1
},
{
"name": "杜重治",
"title": "会计",
"base": "上海",
"age": 63,
"hireDate": "2011/07/25",
"salary": 170750,
"DT_RowId": 2
},
{
"name": "陈锋",
"title": "初级开发者",
"base": "深圳",
"age": 66,
"hireDate": "2009/01/12",
"salary": 86000,
"DT_RowId": 3
}
]
}