user2843365
user2843365

Reputation: 397

Dynatable Implementation

I am attempting to learn some jQuery and javascript and have a neat project to try. It involves pulling data from a JSON file and displaying it in a table form, based on date. I've found Dynatable which seems to do what I want, but I keep getting an "unexpected end of JSON input" error. I am using the same syntax as in the example given on the Dynatabe page, but it does not return any records. Any help would be appreciated, as I'm sure I'm missing something simple. The JSON file is named json-records.json

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

<head>

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
	<script src="./jspkg-archive/jquery.dynatable.js"></script>
	<script src="json-records.json"></script>
	<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(){
	$('#my-final-table').dynatable();
});


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


</body>
</html>

Upvotes: 0

Views: 2300

Answers (1)

Pat
Pat

Reputation: 2750

You have a stray ',' in your JSON file

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

Upvotes: 1

Related Questions