嵌套对象数据(数组)
该示例展示了 DataTables 使用对象数据,在最简单的情况下可以读取任意对象的属性,而且只要符合javascript标准,可以扩展到n层的嵌套对象/数组
下面的
hr
对象包含了
position
、
salary
、
start_date
三个属性,
contact
包含两个数据,通过数组下标的方式取值
姓名 | 职位 | 工作地点 | 分机号 | 入职时间 | 年薪 |
---|---|---|---|---|---|
姓名 | 职位 | 工作地点 | 分机号 | 入职时间 | 年薪 |
$('#dataTableExample').DataTable($.concatCpt('dataTable', {
"processing": true,
"ajax": "/data/examples/tables/data-tables/dt-ajax-3.json",
"columns": [
{"data": "name"},
{"data": "hr.0"},
{"data": "office"},
{"data": "extn"},
{"data": "hr.2"},
{"data": "hr.1"}
]
}));
{
"data": [
{
"name": "李霞",
"hr": [
"系统架构师",
"¥320,800",
"2011/04/25"
],
"office": "北京",
"extn": "5421"
},
{
"name": "杜重治",
"hr": [
"会计",
"¥170,750",
"2011/07/25"
],
"office": "上海",
"extn": "8422"
},
{
"name": "陈锋",
"hr": [
"初级开发者",
"¥86,000",
"2009/01/12"
],
"office": "深圳",
"extn": "1562"
},
{
"name": "郑伯宁",
"hr": [
"高级JavaScript开发者",
"¥433,060",
"2012/03/29"
],
"office": "北京",
"extn": "6224"
},
{
"name": "施华军",
"hr": [
"会计",
"¥162,700",
"2008/11/28"
],
"office": "上海",
"extn": "5407"
},
{
"name": "吴书振",
"hr": [
"集成专家",
"¥372,000",
"2012/12/02"
],
"office": "南京",
"extn": "4804"
},
{
"name": "张宁",
"hr": [
"销售代表",
"¥137,500",
"2012/08/06"
],
"office": "深圳",
"extn": "9608"
},
{
"name": "马世波",
"hr": [
"集成专家",
"¥327,900",
"2010/10/14"
],
"office": "上海",
"extn": "6200"
},
{
"name": "张章",
"hr": [
"Javascript开发者",
"¥205,500",
"2009/09/15"
],
"office": "深圳",
"extn": "2360"
},
{
"name": "张竹影",
"hr": [
"软件工程师",
"¥103,600",
"2008/12/13"
],
"office": "北京",
"extn": "1667"
},
{
"name": "韩庆福",
"hr": [
"办公室主管",
"¥90,560",
"2008/12/19"
],
"office": "广州",
"extn": "3814"
},
{
"name": "刘勇",
"hr": [
"客户服务",
"¥342,000",
"2013/03/03"
],
"office": "北京",
"extn": "9497"
},
{
"name": "张忆湫",
"hr": [
"大区经理",
"¥470,600",
"2008/10/16"
],
"office": "深圳",
"extn": "6741"
},
{
"name": "尚志兴",
"hr": [
"高级营销设计师",
"¥313,500",
"2012/12/18"
],
"office": "广州",
"extn": "3597"
},
{
"name": "杜若芳",
"hr": [
"大区经理",
"¥385,750",
"2010/03/17"
],
"office": "广州",
"extn": "1965"
},
{
"name": "杨乔松",
"hr": [
"营销设计师",
"¥198,500",
"2012/11/27"
],
"office": "广州",
"extn": "1581"
},
{
"name": "闫跃进",
"hr": [
"CEO",
"¥725,000",
"2010/06/09"
],
"office": "南京",
"extn": "3059"
},
{
"name": "孙凯",
"hr": [
"系统管理员",
"¥237,500",
"2009/04/10"
],
"office": "南京",
"extn": "1721"
},
{
"name": "赖祥校",
"hr": [
"软件工程师",
"¥132,000",
"2012/10/13"
],
"office": "广州",
"extn": "2558"
},
{
"name": "郭晖",
"hr": [
"人事主管",
"¥217,500",
"2012/09/26"
],
"office": "北京",
"extn": "2290"
},
{
"name": "贺光明",
"hr": [
"技术主管",
"¥345,000",
"2011/09/03"
],
"office": "南京",
"extn": "1937"
},
{
"name": "邓小燕",
"hr": [
"CMO",
"¥675,000",
"2009/06/25"
],
"office": "南京",
"extn": "6154"
},
{
"name": "白莉惠",
"hr": [
"售前支持",
"¥106,450",
"2011/12/12"
],
"office": "南京",
"extn": "8330"
},
{
"name": "杨海霞",
"hr": [
"销售代表",
"¥85,600",
"2010/09/20"
],
"office": "成都",
"extn": "3023"
},
{
"name": "利旭日",
"hr": [
"CEO",
"¥1,200,000",
"2009/10/09"
],
"office": "广州",
"extn": "5797"
},
{
"name": "范永胜",
"hr": [
"开发者",
"¥92,575",
"2010/12/22"
],
"office": "北京",
"extn": "8822"
},
{
"name": "于怀斌",
"hr": [
"大区经理",
"¥357,650",
"2010/11/14"
],
"office": "苏州",
"extn": "9239"
},
{
"name": "赵淑娜",
"hr": [
"软件工程师",
"¥206,850",
"2011/06/07"
],
"office": "深圳",
"extn": "1314"
},
{
"name": "张淑杰",
"hr": [
"COO",
"¥850,000",
"2010/03/11"
],
"office": "深圳",
"extn": "2947"
},
{
"name": "陈俊军",
"hr": [
"区域销售",
"¥163,000",
"2011/08/14"
],
"office": "上海",
"extn": "8899"
},
{
"name": "郭增杰",
"hr": [
"集成专家",
"¥95,400",
"2011/06/02"
],
"office": "成都",
"extn": "2769"
},
{
"name": "林云",
"hr": [
"开发者",
"¥114,500",
"2009/10/22"
],
"office": "广州",
"extn": "6832"
},
{
"name": "郭述龙",
"hr": [
"技术作者",
"¥145,000",
"2011/05/07"
],
"office": "广州",
"extn": "3606"
},
{
"name": "杨军",
"hr": [
"团队主管",
"¥235,500",
"2008/10/26"
],
"office": "深圳",
"extn": "2860"
},
{
"name": "张海龙",
"hr": [
"售后支持",
"¥324,050",
"2011/03/09"
],
"office": "北京",
"extn": "8240"
},
{
"name": "耿静",
"hr": [
"营销设计师",
"¥85,675",
"2009/12/09"
],
"office": "深圳",
"extn": "5384"
},
{
"name": "刘晋荣",
"hr": [
"办公室主管",
"¥164,500",
"2008/12/16"
],
"office": "深圳",
"extn": "7031"
},
{
"name": "孙宁",
"hr": [
"秘书",
"¥109,850",
"2010/02/12"
],
"office": "深圳",
"extn": "6318"
},
{
"name": "邢洪锐",
"hr": [
"财务总监",
"¥452,500",
"2009/02/14"
],
"office": "深圳",
"extn": "9422"
},
{
"name": "陈云云",
"hr": [
"办公室主管",
"¥136,200",
"2008/12/11"
],
"office": "广州",
"extn": "7580"
},
{
"name": "张禄",
"hr": [
"主任",
"¥645,750",
"2008/09/26"
],
"office": "南京",
"extn": "1042"
},
{
"name": "王增凤",
"hr": [
"技术支持工程师",
"¥234,500",
"2011/02/03"
],
"office": "苏州",
"extn": "2120"
},
{
"name": "沈捷",
"hr": [
"软件工程师",
"¥163,500",
"2011/05/03"
],
"office": "广州",
"extn": "6222"
},
{
"name": "汪化言",
"hr": [
"技术支持工程师",
"¥139,575",
"2009/08/19"
],
"office": "上海",
"extn": "9383"
},
{
"name": "杨正机",
"hr": [
"开发者",
"¥98,540",
"2013/08/11"
],
"office": "南京",
"extn": "8327"
},
{
"name": "戴向军",
"hr": [
"技术支持工程师",
"¥87,500",
"2009/07/07"
],
"office": "深圳",
"extn": "2927"
},
{
"name": "王延芳",
"hr": [
"数据分析工程师",
"¥138,575",
"2012/04/09"
],
"office": "苏州",
"extn": "8352"
},
{
"name": "沈健",
"hr": [
"软件工程师",
"¥125,250",
"2010/01/04"
],
"office": "南京",
"extn": "7439"
},
{
"name": "刘伟峰",
"hr": [
"软件工程师",
"¥115,000",
"2012/06/01"
],
"office": "深圳",
"extn": "4389"
},
{
"name": "陆先生",
"hr": [
"初级Javascript开发者",
"¥75,650",
"2013/02/01"
],
"office": "北京",
"extn": "3431"
},
{
"name": "纪虹羽",
"hr": [
"销售代表",
"¥145,600",
"2011/12/06"
],
"office": "南京",
"extn": "3990"
},
{
"name": "肖艳",
"hr": [
"大区经理",
"¥356,250",
"2011/03/21"
],
"office": "广州",
"extn": "1016"
},
{
"name": "沈国金",
"hr": [
"系统管理员",
"¥103,500",
"2009/02/27"
],
"office": "广州",
"extn": "6733"
},
{
"name": "王燕峰",
"hr": [
"开发者",
"¥86,500",
"2010/07/14"
],
"office": "深圳",
"extn": "8196"
},
{
"name": "徐若琳",
"hr": [
"大区经理",
"¥183,000",
"2008/11/13"
],
"office": "北京",
"extn": "6373"
},
{
"name": "徐成业",
"hr": [
"Javascript开发者",
"¥183,000",
"2011/06/27"
],
"office": "苏州",
"extn": "5384"
},
{
"name": "李岸白",
"hr": [
"客户服务",
"¥112,000",
"2011/01/25"
],
"office": "南京",
"extn": "4226"
}
]
}
<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>