html5 - datatables 加載不出來數(shù)據(jù)。
問題描述
我在后臺已經(jīng)請求到了json數(shù)據(jù),如下`
[{'aid':100000,'name':'JYCM201609010250','rtsp':'947|100000|3750','statuz':'1','updateTime':'2017-05-31'},{'aid':100001,'name':'gui','rtsp':'947|100000|3750','statuz':'0','updateTime':'2017-05-31'}]
下面是我的js 代碼
<script> $(document).ready(function () {$(’#table_id_example’).DataTable({ 'iDisplayLength': 10, 'bLengthChange': false, 'ajax': {'url': '/media','dataType': 'json','success': function (json) { console.log(json)} }, 'columns': [{ 'data': ’aid’},{ 'data': ’name’},{ 'data': ’rtsp’},{ 'data': ’statuz’},{ 'data': ’updateTime’} ]}); });</script>
后臺代碼
@Autowired private MediaImpl media; @ResponseBody @RequestMapping(value = '/media',method = RequestMethod.GET) public List<Media> MediaAll(){System.out.println('------------------------------------------------------');return media.findAll(); }
html代碼
<link rel='stylesheet' href='http://www.gepszalag.com/css/jquery.dataTables.css' th:href='http://www.gepszalag.com/wenda/@{css/jquery.dataTables.css}'/><script type='text/javascript' src='http://www.gepszalag.com/js/jquery.min.js' th:src='http://www.gepszalag.com/wenda/@{/js/jquery.min.js}'></script><script type='text/javascript' src='http://www.gepszalag.com/js/jquery.dataTables.js' th:src='http://www.gepszalag.com/wenda/@{js/jquery.dataTables.js}'></script><body><table cellspacing='0' width='100%'> <thead> <tr><th>媒資ID</th><th>媒資名稱</th><th>播放串</th><th>狀態(tài)</th><th>更新時間</th> </tr> </thead> <!-- <tbody> <tr><td>Row 1 Data 1</td><td>Row 1 Data 1</td><td>Row 1 Data 1</td><td>Row 1 Data 1</td><td>Row 1 Data 1</td> </tr></tbody>--></table></body>
前后臺都沒有報錯,但就是顯示不出來數(shù)據(jù)。請問是少配置還是那塊書寫錯誤,謝謝
問題解答
回答1:用過這個插件,你還要加一個datasrc說明,獲取成功之后,從哪提數(shù)據(jù)。(修正,可能不是datasrc的原因,但看著又像是沒加這個的原因)這是我用到的代碼,看是否能給你點啟示:`$.ajax({
type:’GET’,***/*省略某些代碼*/*** success:function(result){ /*聲明一個空對象*/ var returnData = {}; returnData.data = result.rows //數(shù)據(jù)來源 callback(returnData) //此步不能省略,最重要的就是調(diào)用callback }
})`
回答2:官網(wǎng)上對獲取的json數(shù)據(jù)有這種要求
By default DataTables will look for the property data (or aaData for compatibility with DataTables 1.9-) when obtaining data from an Ajax source or for server-side processing
也就是說你那個包含各個數(shù)據(jù)的數(shù)組應(yīng)該放在data屬性里,這樣應(yīng)該就可以了
{'data':[{'aid':100000,'name':'JYCM201609010250','rtsp':'947|100000|3750','statuz':'1','updateTime':'2017-05-31'},{'aid':100001,'name':'gui','rtsp':'947|100000|3750','statuz':'0','updateTime':'2017-05-31'}]}
data同級還可以放別的如條目總數(shù)等的參數(shù)
相關(guān)文章:
1. mysql - 表名稱前綴到底有啥用?2. 致命錯誤: Class ’appfacadeTest’ not found3. 老師們php,插入數(shù)據(jù)庫mysql,都是空的,要怎么解決4. 求大神支招,php怎么操作在一個html文件的<head>標(biāo)記內(nèi)添加內(nèi)容?5. php點贊一天一次怎么實現(xiàn)6. 怎么php怎么通過數(shù)組顯示sql查詢結(jié)果呢,查詢結(jié)果有多條,如圖。7. PHP類屬性聲明?8. sql語句 - 如何在mysql中批量添加用戶?9. phpstady在win10上運行10. 在應(yīng)用配置文件 app.php 中找不到’route_check_cache’配置項
