Noah Garfinkle
PersonMonthly pay
Jan Molby£12,000
Steve Nicol£8,500
Steve McMahon£9,200
John Barnes£15,300
TOTAL£45,000

Existing JSON

Perhaps we already have our data in JSON format. We can skip the initial record normalization by setting up an empty table for rendering and directly passing our data into dynatable:

HTML table to render records:

<table id="my-final-table">
  <thead>
    <th>Band</th>
    <th>Song</th>
  </thead>
  <tbody>
  </tbody>
</table>
Of course we could just code the json data directly in our JavaScript on the right, but what's the fun in that? As a bonus, edit the JSON data to the right and watch the data in the table update in real-time. →

This is a pre#json-records element:

[
  {
    "band": "Weezer",
    "song": "El Scorcho"
  },
  {
    "band": "Chevelle",
    "song": "Family System"
  }
]
var $records = $('#json-records'),
    myRecords = JSON.parse($records.text());
$('#my-final-table').dynatable({
  dataset: {
    records: myRecords
  }
});


Band Song
Band Song