Cannot make Datatables get data from the server
Cannot make Datatables get data from the server
I've been using Datatables successfully in my current project, when I managed to get data from ajax request on my own. (I have to populate both a table and Google map.).
On another page, I wanted to try the server-site processing capabilities of Datatables.
I just took the code from the example to give it a try, but using an url to my server.
[code]
$(document).ready(function() {
$('#race_list').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "/calendar/calendar.json"
} );
} );
[/code]
The problem is that the ajax call never gets triggered. I see to trace in the server's log.
I tried doing a post request
[code]
$('#race_list').dataTable( {
"sAjaxSource": "/calendar/calendar.json",
"fnServerData": function ( sSource, aoData, fnCallback ) {
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
} );
}
} );
[/code]
But it didn't work either. If I populate the table by hand, I can check that the pluggin in working. But I cannot make it load data from the server.
If try
[code]
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": "/calendar/calendar.json"
} );
[/code]
It works perfectly well.
Am I missing something obvious?
Thanks for your help.
JLF
On another page, I wanted to try the server-site processing capabilities of Datatables.
I just took the code from the example to give it a try, but using an url to my server.
[code]
$(document).ready(function() {
$('#race_list').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "/calendar/calendar.json"
} );
} );
[/code]
The problem is that the ajax call never gets triggered. I see to trace in the server's log.
I tried doing a post request
[code]
$('#race_list').dataTable( {
"sAjaxSource": "/calendar/calendar.json",
"fnServerData": function ( sSource, aoData, fnCallback ) {
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
} );
}
} );
[/code]
But it didn't work either. If I populate the table by hand, I can check that the pluggin in working. But I cannot make it load data from the server.
If try
[code]
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": "/calendar/calendar.json"
} );
[/code]
It works perfectly well.
Am I missing something obvious?
Thanks for your help.
JLF
This discussion has been closed.
Replies
[code]
$(document).ready(function() {
alert( $('#race_list').length +' '+ ('#race_list')[0].nodeName );
$('#race_list').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "/calendar/calendar.json"
} );
} );
[/code]
I don't see anything wrong with this initialisation (as long as the alert gives something like "1 TABLE"). If you use Firebug, can you see the XHR going out or not?
Allan
I don't get the response expected. The alert shows "1 undefined".
This is the HTML I used to create the table
[code]
<%=t('locator.race_header')%>
<%=t('locator.date_header')%>
<%=t('locator.country_header')%>
<%=t('locator.state_region_header')%>
<%=t('locator.city_header')%>
[/code]
I tried again today and now it works. The ajax call gets triggered.
This is weird !!
Thanks again
Regards,
Allan