0

I am currently working on a personal project using Last FM's API to display data on my music tastes.

The first task I've given myself is to create a table which displays my Recently Played Tracks.

I'm using the DataTables plugin for JQuery as I want to refresh the table's data on the fly as I play more tunes using AJAX.

The JSON data returned by the Last FM API is a little messy so I'm using the JQuery Map method to create a new array of objects only containing the attributes I intend to use from the API.

Here's a fiddle of what I have so far:

http://jsfiddle.net/8rekuLaf/2/

However because I want to refresh the data as a new song plays I wonder whether I should remove the map stuff and populate my DataTable directly from AJAX. I've been unable to do this. Below is an example of one unsuccessful attempt:

config.recentTracksElement.dataTable({
    "ajax": config.getRecentTracksURL,
        "columns": [{
        "data": "name"
    }, {
        "data": "artist.#text"
    }, ]
});

Anyone who could show me how to use JSON from a URL with Datatables would be a great help. And also how to use AJAX reload to refresh the data.

Thanks

isherwood
  • 58,414
  • 16
  • 114
  • 157
James Howell
  • 1,392
  • 5
  • 24
  • 42
  • http://www.datatables.net/examples/ajax/ – isherwood Sep 17 '14 at 21:33
  • you need to over-ride the methods that fetch data. the piplining code is a good start. – dandavis Sep 17 '14 at 21:38
  • isherwood thanks for the link but I have looked through those examples already and tried them out. As I've explained the JSON returned by Last FM's API is a little more complex than their perfect world examples. – James Howell Sep 17 '14 at 21:49
  • you are on the right track converting your available data into a shape datatable consumes. all you need to do is bolt on the settings like pagination, search, etc, using datatables method over-rides. it's a bit confusing how it works, but you are actually almost there, just a little more head-pounding to go. the piplining plugin/demo/example code shows how to connect the last few remaining bolts. – dandavis Sep 17 '14 at 22:32
  • Hi Dan, I actually think the problem I'm having is to do with the way I'm accessing the data when passing it to the columns. I've created a fiddle to show the error I get in the console:http://jsfiddle.net/8rekuLaf/3/ – James Howell Sep 18 '14 at 07:51

0 Answers0