【问题标题】:Datatables uninformative数据表无信息
【发布时间】:2016-08-25 15:17:59
【问题描述】:

我正在尝试从我的 webapi 返回的以下 json 数据构建数据表:

{
    "body": {
        "recording": [],
        "alarm": [{
            "device_id": "someID",
            "device_name": " ",
            "channel_id": "1",
            "start_time": "2016-08-21T16:15:57+03:00",
            "timestamp": 1471785357,
            "end_time": "2016-08-21T16:16:07+03:00",
            "storage_key": "some string",
            "duration": 10,
            "expiration_time": 1474416000,
            "file_name": "file name4",
            "size": 703504,
            "group_id": "some guid",
            "event_type": "m",
            "local_ttl": 2278752,
            "thumbnail": null
        }, {
            "device_id": "someID",
            "device_name": " ",
            "channel_id": "1",
            "start_time": "2016-08-21T16:15:57+03:00",
            "timestamp": 1471785357,
            "end_time": "2016-08-21T16:16:07+03:00",
            "storage_key": "some string",
            "duration": 10,
            "expiration_time": 1474416000,
            "file_name": "file name4",
            "size": 703504,
            "group_id": "some guid",
            "event_type": "m",
            "local_ttl": 2278752,
            "thumbnail": null
        }],
        "guard_tour": [],
        "continuous_event": []
    },
    "header": {
        "request_id": "some id",
        "response_status": "OK",
        "message": "endpoint succeeded"
    }
}

我正在像这样构建我的数据表:

$("#alarmTable").DataTable({
   ajax: {
     url: 'myurl',
     dataSrc: 'body.alarm'
   }
});

我收到以下错误:数据表为第 0 行第 0 列请求未知参数 0

也许更有经验的眼睛会为我节省几个小时来解决这个问题

编辑:我的html

   <table id="alarmTable" class="table table-striped">
                <thead>
                    <tr>
                        <th>Device ID</th>
                        <th>Device Name</th>
                        <th>Channel Id</th>
                        <th>Start Time</th>
                        <th>End Time</th>
                        <th>Duration</th>
                        <th>File Name</th>
                        <th>size</th>
                        <th>Event Type</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>

另外,我的 web api 只是一个代理,所以我不能真正改变我的 json 格式

【问题讨论】:

标签: jquery datatables


【解决方案1】:

您的 JSON 设置是正确的,除非您尝试在标记中定义列,您应该在 columns 部分进行:

var table = $('#alarmTable').DataTable({
  ajax: {
    url: 'yoururl',
    dataSrc: 'body.alarm'
  },
  columns : [
     { data: 'device_id', title: 'Device Name' },
     { data: 'channel_id', title: 'Channel Id' },     
     { data: 'start_time', title: 'Start Time' },     
     { data: 'end_time', title: 'End Time' },  
     { data: 'duration', title: 'Duration' },          
     //and so on, you get the picture
  ]
})  

然后标记可以减少到

<table id="alarmTable" class="table table-striped"></table>

演示 -> http://jsfiddle.net/1ay7nfhk/

【讨论】:

    猜你喜欢
    • 2014-05-24
    • 2016-11-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-10-30
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多