2015-11-07 116 views
0

我有以下从服务器的JSON响应:数据表:如何在数据表行中显示json数据?

{ 
    "rData": { 
     "total": 17, 
     "per_page": 3, 
     "current_page": 1, 
     "last_page": 6, 
     "next_page_url": "http://localhost:9901/securityquestionlist/?page=2", 
     "prev_page_url": null, 
     "from": 1, 
     "to": 3, 
     "data": [ 
      { 
       "question": "Accessor: 15th question", 
       "full_name": "Dave Alex" 
      }, 
      { 
       "question": "Accessor: 14th question", 
       "full_name": "Dave Alex" 
      }, 
      { 
       "question": "Accessor: 13th question", 
       "full_name": "Dave Alex" 
      } 
     ] 
    } 
} 

我有以下的HTML代码:

<table id="IdSQLTable" class="table table-striped table-bordered table-hover"> 
    <thead> 
     <tr><th>Question</th></tr> 
    </thead> 
    <tbody></tbody> 
</table> 

以下是JavaScript代码:

jQuery(document).ready(function() { 
     jQuery('#IdSQLTable').DataTable({ 

      'ajax' : { 
       'url': 'http://localhost:9901/securityquestionlist', 
       'data' : function(d){ 
        d.myKey = 'MyValue'; 
       }, 
       'cache' : false, 
       'method' : 'POST' 
      }, 

      "columnDefs": [ { 
       "targets": [ 0 ], 
       "data": 'rData.data.question', 
       "defaultContent": "Click to edit" 
      } ]     
     }); 
    }); 

我无法打印 '问题'在桌子里。有人能指导我如何去做。

回答

0

设置ajax.dataSrc目标rData.data

ajax : { 
    url: 'http://localhost:9901/securityquestionlist', 
    dataSrc : function(json) { 
    return json.rData.data; 
    } 
    ... 
} 

,并相应地更改列定义:

"columnDefs": [ { 
    "targets": [ 0 ], 
    "data": 'question', 
    "defaultContent": "Click to edit" 
} ] 

那么它的工作原理 - >http://jsfiddle.net/cgzhdhos/