DataTables not working?

Yusri Khairi

Greetings. I'm Yusri Khairi and I'm new to DataTables. I have to say that this plug-in is very great. Oh, and thanks to rahmad for grabbing data from Google Spreadsheet idea. :D (http://datatables.net/forums/discussion/5611/how-to-grab-datatables-data-from-a-google-spreadsheet)

But I have a problem. The table works in DataTables live (http://live.datatables.net/duxoguqi/1/edit) as well as in Weebly Edit Mode, but somehow it doesn't work on the actual site (http://taikoparadise.weebly.com/song-list.html). Did I miss something?

Additional bits: DataTables debugger code: ulosoz

tangerine

Your code at live.datatables.net references jquery.datatables.js and includes a datatable initialisation script.

Your code at the actual site does neither.

Yusri Khairi

What should I do in order to fix it? I have changed the process to using TableTop-to-DataTables, but no results.

Yusri Khairi

So, I modified the script here and there but it's still not working. When I use "inspect element", I found this.

Uncaught TypeError: undefined is not a function song-list.html:956

And the position of the error is this:

$(document).ready(function(){
   $('#test').dataTable({ //This is the line where error is located
     "ajax": {
       "url": "http://spreadsheets.google.com/feeds/list/0AgRN47YHZsDvdGRCMHV0UXlqQlVhbms2SktzLTMwQ0E/od6/public/values?alt=json",
       "dataSrc": "feed.entry"
     },
     "processing": true,
     "serverSide": false,
     "columns": [
       { "data": "gsx$songtitle.$t" },
       { "data": "gsx$genre.$t" },
       { "data": "gsx$starsinoni.$t" },
       { "data": "gsx$starsinuraoni.$t" },
       { "data": "gsx$downloadlink.$t" }
     ],
     "order": [[1, "asc"]]
    });
});

Is there anything I really miss?

allan

For whatever reason your page is loading jQuery five times. I would suggest loading it only once... That very likely is the cause of the problem.

Allan

Yusri Khairi

I have deleted some of older jQuery, but unfortunately there is one more jQuery that cannot be deleted (which is placed on line 75, version 1.7.2).

Is there any way to manipulate the code so it works?
If there isn't, I guess I have to go back to using iframe embedding.

allan

Can you not just use that one version of jQuery? The issue is that when you load jQuery again it overwrites itself, thus loosing any plug-ins that have been loaded already. You could use $.noConflict() (see the jQuery documentation) if you can't reduce it to a single file.

Allan

Yusri Khairi

Now it works! Thank you, allan! :D