successful JSONP request, but

successful JSONP request, but

shamelessshameless Posts: 31Questions: 0Answers: 0
edited April 2011 in General
Alan,

Adapting a datatable that is working swimmingly on a "native" site to display via cross-domain JSONP retrieval / load of data and the results are:

1. Firebug indicates that the data is being successfully retrieved and it appears to be exactly the same JSON result that DT loads and displays successfully on the native site.

2. After DT initialization, I get this message "Processing...No data available in table" and no other errors. I also get the console error via Firebug "invalid label" and this is highlighted "{"sEcho": 0,"iTotalRecords": 2,"iTotalDisplayRecords": 2,"aaData": ["

The only changes that I've made in my DT code from what works on the native site is the following:
[code]
"fnServerData": function ( sSource, aoData, fnCallback ) {
$.ajax( {
"dataType": 'jsonp',
"type": "GET",
"url": sSource,
"data": aoData,
} );
},
[/code]

...and I can remove the "invalid label" error by wrapping my normal DT json result like this:

[code]
echo _GET['callback'] . '(' . $normal_DT_json_result . ');';
[/code]

This gets rid of the Firebug errors, but makes no difference to Datatables; I get the same "Processing....No data available in table".

I don't have a page outside of a secure area where I can live demo, but here is a link to the relevant code

http://pastebin.com/yMeheJDF

ftr, I have tried both "sAJx = "http://esc.toypizza.com/index.php/ajx/getthere?callback=?" and sAJx = "http://esc.toypizza.com/index.php/ajx/getthere" and I get the same result since I think that JQuery generates the callback function name with the "jsonp" option.

Totally mystified here; any help would be appreciated.

Shamelss

Replies

  • allanallan Posts: 63,516Questions: 1Answers: 10,473 Site admin
    Hi Shameless,

    I think the only thing missing from your code is a 'success' callback to fnCallback. I've just tried the following:

    [code]
    "fnServerData": function ( sSource, aoData, fnCallback ) {
    $.ajax( {
    "dataType": 'jsonp',
    "type": "GET",
    "url": sSource,
    "data": aoData,
    "success": fnCallback
    } );
    }
    [/code]
    and modified the output line of the server-side processing script to be:

    [code]
    echo $_GET['callback'].'('.json_encode( $output ).')';
    [/code]
    and that seems to load cross domain no problem.

    I've added it to my to-do list to make an example of this.

    Regards,
    Allan
  • shamelessshameless Posts: 31Questions: 0Answers: 0
    Alan,

    I have made your suggested modifications. You can see the current state of the DT init at:

    http://pastebin.com/DtPphbPP

    My relevant server-side line:

    [code]
    echo $_GET['callback']. '(' . $this->Sysalert->get_sysalert_co_dt() . ');';
    [/code]

    Here is the returned data:
    [code]
    jQuery1501661574962660951_1303050338963({"sEcho": 0,"iTotalRecords": 2,"iTotalDisplayRecords": 2,"aaData": [

    [
    "","36","0","2011-04-07 15:16:37","2011-04-07 15:16:37","1","1","1","","1","1","1","1","1","1","Auto Table Test","Thu, 07 Apr 2011 22:16:35 GMTAuto Table Test detail
    ","Thu, 07 Apr 2011 22:16:35 GMTAuto Table Test solution
    ","05:15:00","2011-04-07"],


    [
    "","35","0","2011-04-07 12:10:57","2011-04-07 12:10:57","1","1","1","1","1","1","1","1","1","1","Thursday two","Thu, 07 Apr 2011 19:10:56 GMTThursday two detail
    ","Thu, 07 Apr 2011 19:10:56 GMTThursday two solution
    ","02:10:00","2011-04-07"]

    ]});
    [/code]

    The only difference between this and the one that works on the native site is "jQuery1501661574962660951_1303050338963()" call wrapper.

    The result that I am getting is the same as before;; no console errors.

    Am I supposed to be setting some other option--or eliminating one--when I use "fnServerData"?

    Here's a link to the relevant script:

    http://www.getthere.co/_js/sabre.js

    Regards,

    Shameless
  • allanallan Posts: 63,516Questions: 1Answers: 10,473 Site admin
    Thanks for the update - it all looks good to me - with the exception of sEcho: 0. That looks a bit dodgy. sEcho should never be 0 - it should be an echo of the sEcho parameter passed in (cast an an integer for security reasons) - which increases by one for every draw that is done.

    Allan
  • shamelessshameless Posts: 31Questions: 0Answers: 0
    edited April 2011
    Good point re: sEcho: I initialize those originally from the $_POST array, but that is an empty array because of the "type": "GET" option, correct?

    So, since this was using the original code from the native site, the $_POST array is empty and the $_GET array contains:

    [code]
    Array
    (
    [callback] => jQuery15005358027204138294_1303054812246
    [_] => 1303054812950
    )
    [/code]

    Q: so if the sEcho key is not present in either array, the default value should be "1" and not "0"?

    UPDATE: I've tried initializing to both "0" and "1" when the sEcho key is not present. Also, I have using CodeIgniter and have modified my code to not simply look for sEcho in the $_POST array but have started using the "$this->input->get_post()" function which searches through both the post and get streams for data, looking first in post, and then in get. RESULT: No changes.

    I am currently using DT Version 1.7.5: Any chance that upgrading to the latest version would fix this?
  • allanallan Posts: 63,516Questions: 1Answers: 10,473 Site admin
    Can you show me the rest of your DataTables initialisation please? If _GET has only those two jQuery parameters and _POST is empty, then something has gone wrong somewhere... I'm just guessing, but perhaps bServerSide: "true", rather than bServerSide: true (i.e. no quotes)?

    Allan
  • shamelessshameless Posts: 31Questions: 0Answers: 0
    edited April 2011
    Wow. Your support is like undergoing a code review with Carnac.

    http://www.youtube.com/watch?v=XnwyQFe3wRA

    I was missing bServerSide completely.

    It's working now. Thanks immensely.
  • allanallan Posts: 63,516Questions: 1Answers: 10,473 Site admin
    Rotfl - brilliant. Although I don't have a hat nearly as cool as that ;-)

    Allan
This discussion has been closed.