easyui datagrid解析复杂json数组对象
JSON数组对象如下:
{
"code": 0,
"msg": null,
"rows": [
{
"id": null,
"earId": "001AG1800002",
"ramEarId": "001AG1800001",
"varityName": "安哥拉山羊",
"mating1": {
"1": "2018-08-10"
},
"mating2": {
"1": "2018-07-30",
"2": "2018-07-30"
},
"mating3": {
"2": "2018-08-19",
"3": "2018-08-19"
},
"prePregnacyDate": null,
"oestrusDate": null,
"matingNum": null,
"remark": null
}
],
"total": null
}
页面代码
<table class="easyui-datagrid" title=" <i class='iconfont'></i> 繁殖母羊配种信息"
pagination="true"
pageSize="20"
pageList="[20,30,40,50]"
toolbar="#toolbar"
data-options="url:baseurl + 's/matingRecord/createMatingRecord',singleSelect:true,rownumbers:true,striped:true,idField:'id',fit:true,onSelect:rowSelected,queryParams:qparams">
<thead frozen="true">
<tr>
<th rowspan="2" data-options="field:'varityName',width:'150'">品种</th>
<th rowspan="2" data-options="field:'earId',width:'150'">母羊耳号</th>
<th rowspan="2" data-options="field:'ramEarId',width:'150'">配种公羊耳号</th>
<th colspan="3" width="300">第一情期</th>
<th colspan="3" width="300">第二情期</th>
<th colspan="3" width="300">第三情期</th>
<th rowspan="2" data-options="field:'prePregnacyDate',width:'150'">预产期</th>
<th rowspan="2" data-options="field:'remark',width:'150'">备注</th>
</tr>
<tr>
<th data-options="field:'mating1',width:'120',
formatter:function(value,row,index){
if(value != null && value.hasOwnProperty('1')){return value['1']+'上午';}}">一次</th>
<th data-options="field:'mating1',width:'120',
formatter:function(value,row,index){
if(value != null && value.hasOwnProperty('2')){return value['2']+'中午';}}">二次</th>
<th data-options="field:'mating1',width:'120',
formatter:function(value,row,index){
if(value != null && value.hasOwnProperty('3')){return value['3']+'下午';}}">三次</th>
<th data-options="field:'mating2',width:'120',
formatter:function(value,row,index){
if(value != null && value.hasOwnProperty('1')){return value['1']+'上午';}}">一次</th>
<th data-options="field:'mating2',width:'120',
formatter:function(value,row,index){
if(value != null && value.hasOwnProperty('2')){return value['2']+'中午';}}">二次</th>
<th data-options="field:'mating2',width:'120',
formatter:function(value,row,index){
if(value != null && value.hasOwnProperty('3')){return value['3']+'下午';}}">三次</th>
<th data-options="field:'mating3',width:'120',
formatter:function(value,row,index){
if(value != null && value.hasOwnProperty('1')){return value['1']+'上午';}}">一次</th>
<th data-options="field:'mating3',width:'120',
formatter:function(value,row,index){
if(value != null && value.hasOwnProperty('2')){return value['2']+'中午';}}">二次</th>
<th data-options="field:'mating3',width:'120',
formatter:function(value,row,index){
if(value != null && value.hasOwnProperty('3')){return value['3']+'下午';}}">三次</th>
</tr>
</thead>
</table>
注意事项
普通JSON对象读取key,采用JSON对象.key,如果key为Number或者String类型的数字采用JSON对象[‘key’]。举个栗子:
var json = {
"varityName": "安哥拉山羊",
"mating1": {
"1": "2018-08-10"
}
}
传统的读取value:
console.log(json.varityName);
通用型读取value:
console.log(json.mating1['1']);