Question

我的控制器类中有一个返回json数据的方法，它采用以下格式

[  
   {  
      "userRoleMappingTO":{  
         "userRoleMappingId":1,
         "applicationId":1,
         "userId":194,
         "roleId":1,
         "smartwcmTreeId":1
      },
      "roleTO":{  
         "roleId":1,
         "roleName":"Consumer",
         "applicationId":1
      },
      "userTO":{  
         "userId":194,
         "applicationId":"pgm-apn",
         "username":"joe.antony",
         "password":"password1",
         "email":"joey@gmail.com",
         "firstName":"Joey",
         "lastName":"Anto",
         "enabled":true,
         "userCreated":"sitepmadm",
         "userModified":"sitepmadm",
         "createdTime":1423755723104,
         "updatedTime":1423755961440
      }
   },
   {  
      "userRoleMappingTO":{  
         "userRoleMappingId":2,
         "applicationId":1,
         "userId":189,
         "roleId":2,
         "smartwcmTreeId":1
      },
      "roleTO":{  
         "roleId":2,
         "roleName":"Contributor",
         "applicationId":1
      },
      "userTO":{  
         "userId":189,
         "applicationId":"pgm-apn",
         "username":"test.user",
         "password":"password1",
         "email":"test.user@test.com",
         "firstName":"newuser",
         "lastName":"usertest",
         "enabled":true,
         "userCreated":"sitepmadm",
         "userModified":"sitepmadm",
         "createdTime":1423490983028,
         "updatedTime":1423490983028
      }
   }
]

我正在尝试将此数据显示为数据表，我要求的唯一字段是 userId，username，roleName applicationId

我通常按如下方式初始化数据表

 $('#example').dataTable({

            "ajax": {
                    "url": "/the url",
                    "dataSrc":  "",
                    },

            "columns":[
            {"data": "userId"},
            {"data": "applicationId"},
            {"data": "username"},
            {"data": "roleName"},
            ],
            });

我需要做些哪些更改才能获得表格中显示的正确数据

Answer 1

您的DataTables初始化代码应更改为：

$('#example').DataTable({
    "ajax": {
        "url": "/the url",
        "dataSrc": ""
    },
    "columns": [
       {"data": "userTO.userId"},
       {"data": "userTO.applicationId"},
       {"data": "userTO.username"},
       {"data": "roleTO.roleName"}
    ]  
});

其中dataSrc设置为空字符串允许您返回普通数组，而columns.data属性中的点分表示允许访问嵌套对象。

请参阅this JSFiddle进行演示。

使用json数据实现jquery数据表

1 个答案: