Safari 5 not refreshing table with new data

jarviswabi

I've got a server-side-driven DataTable working nicely in IE and Firefox. What's weird is that in Safari 5, the initial record set loads up fine and displays in the table, but when I try going to the next page (using the pagination controls), the request is made and the data comes back (I verified this with Firebug Lite) but the table doesn't refresh, and the "processing..." indicator persists. I don't see any Javascript errors or anything to explain why it's not updating the table. Obviously, the JSON data coming from my server-side script is fine because it's able to populate the initial recordset. And the subsequent requests all appear fine, they just don't update the table display.

This is a real pain because this script is perfect for what I need, but my page has to work on an iPad, so if I can't figure out why Safari is being weird, I'll have to start over.

jarviswabi

Did a little playing around with the success/fnCallback piece of the fnServerData block and it seems like the page changes in Safari are not hitting the success event.

Using the code below, I get the "blah" alert consistently in Firefox when the page first loads and then every time I click to a next page, and after I confirm the alert, the data updates in the table. However, in Safari, I only get the alert on the initial load (followed by the data populating). Clicking the next page link does not produce the alert or the data refresh. So it seems like something in the next page action is causing Safari to get stuck, but I don't yet see what that might be.

[code]
$(document).ready(function() {
$('#invtrans_table').dataTable( {
"bProcessing": true,
"bStateSave": true,
"bLengthChange": false,
"bServerSide": true,
"bJQueryUI": true,
"sAjaxSource": "/cfc/itemsx.cfc?method=getInvTrans",
"aoColumns": [
{"sName": "sTrans", "sTitle": "Transaction", "bSortable": false, sType:"html"},
{"sName": "sTransDate", "sTitle": "Date", "bSortable": false, sType:"html"},
{"sName": "sTransTime", "sTitle": "Time", "bSortable": false, sType:"html"},
{"sName": "sWho", "sTitle": "Who", "bSortable": false, sType:"html"},
{"sName": "sType", "sTitle": "Type", "bSortable": false, sType:"html"},
{"sName": "sFrom", "sTitle": "From", "bSortable": false, sType:"html"},
{"sName": "sTo", "sTitle": "To", "bSortable": false, sType:"html"},
{"sName": "sQty", "sTitle": "Qty", "bSortable": false, sType:"html"},
{"sName": "sCost", "sTitle": "Cost", "bSortable": false, sType:"html"}
],
"sPaginationType": "two_button",
"oLanguage": {
"sLengthMenu": "Page length: _MENU_",
"sSearch": "Filter:",
"sZeroRecords": "No matching records found"
},
"fnServerData": function ( sSource, aoData, fnCallback ) {
aoData.push(
{ "name": "edpno", "value": $("#edpno").val() }
);
$.ajax( {"dataType": 'json', "type": "POST", "url": sSource, "data": aoData,
"success": function(json){
alert('blah');
fnCallback(json);
}
} );
}
} );
} );
[/code]

jarviswabi

Just figured this out, so stupid. I had tweaked my back-end function that was generating the JSON and had inadvertantly messed up the code that creates my array so that there was a trailing comma on any result sets after page 1, which I guess Safari can't handle. Didn't even notice it the first five times I looked at the response in Firebug. Now it works once I fixed the comma.

Love DataTables so far, great work!