Dynatable的實現

我試圖學習一些jQuery和JavaScript，並有一個整潔的項目嘗試。它涉及從JSON文件中提取數據並根據日期以表格形式顯示它。我發現Dynatable似乎做我想做的，但我不斷收到「意外的JSON輸入結束」錯誤。我使用的語法與Dynatabe頁面上給出的示例相同，但它不返回任何記錄。任何幫助將不勝感激，因爲我確信我錯過了簡單的事情。 JSON文件被命名爲JSON-records.jsonDynatable的實現

[ 
 
    { 
 
    "band": "Weezer", 
 
    "song": "GA Scorcho" 
 
    }, 
 
    { 
 
    "band": "Chevelle", 
 
    "song": "Family System" 
 
    }, 
 
]

<html> 
 

 
<head> 
 

 
\t <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
 
\t <script src="./jspkg-archive/jquery.dynatable.js"></script> 
 
\t <script src="json-records.json"></script> 
 
\t <style src="./jspkg-archive/jquery.dynatable.css"></style> 
 
</head> 
 

 
<body> 
 
<table id="my-final-table"> 
 
    <thead> 
 
    <th>Band</th> 
 
    <th>Song</th> 
 
    </thead> 
 
    <tbody> 
 
    </tbody> 
 
</table> 
 

 
<script type="text/javascript"> 
 

 
$(document).ready(function(){ 
 
\t $('#my-final-table').dynatable(); 
 
}); 
 

 

 
var $records = $('#json-records'), 
 
    myRecords = JSON.parse($records.text()); 
 
$('#my-final-table').dynatable({ 
 
    dataset: { 
 
    records: myRecords 
 
    } 
 
}); 
 
</script> 
 

 

 
</body> 
 
</html>

來源

2016-08-18 user2843365

你有一個流浪 '' 在你的JSON文件

[ 
    { 
    "band": "Weezer", 
    "song": "GA Scorcho" 
    }, 
    { 
    "band": "Chevelle", 
    "song": "Family System" 
    }, <--- Here 
]

來源

2016-08-18 23:19:30 Pat

謝謝！我修復了這個錯誤，但它仍然不起作用。當我使用調試器，它似乎掛在這一行myRecords = JSON.parse（$ records.text（））; – user2843365

我正在瀏覽dynatable的文檔，看看你在做他們的例子。你想看的例子是AJAX的例子。如果你已經有了這些數據，並且想要製作一張表格，那麼就使用AJAX。如果你有一個表並想從中獲取數據，那麼使用JSON.parse（） – Pat

這很有道理！我會試試看。非常感謝！！ – user2843365

Dynatable的實現

回答

相關問題