Replies

• allan Posts: 63,498Questions: 1Answers: 10,470 Site admin

  April 2012

  > callback(
  
  That looks dodgy to me - I'd expect it to have a unique number on the function name if nothing else. Have a look at the Ajax returns in my demo for example: http://datatables.net/release-datatables/examples/server_side/jsonp.html . Are you using the 'callback' parameter that jQuery sends you?
  
  Allan
• tjonsek Posts: 8Questions: 0Answers: 0

  April 2012

  Do you mean I'm supposed to receive the response as callback_1( json here)? We are writing code for the site sending the jsonp as well and I don't know if/how to make all the pieces fit.
  
  I"m going to check out your examples. I can say that we are able to see the Response and see the json. Also, I put the response without the jsonp wrapper in a text file and used that as our datasource and the table loaded the data. It just seems it can't handle the text "callback(" at the beginning.
  
  I've tried several settings, like setting datatype to jsonp, defining the columns, making sure we had the exact count and adding the text "aaData:" to the beginning - all pieces which seemed to get us closer but not there.
  
  It seems as if there would be a very straightforward way of pulling in jsonp data but I've not found any examples and certainly none that work on our site.
• tjonsek Posts: 8Questions: 0Answers: 0

  April 2012

  But when you ask if I'm using the 'callback' parameter, what do you mean by using it?
• tjonsek Posts: 8Questions: 0Answers: 0

  April 2012

  Let me show you the code that works without jsonp data format.
  $(document).ready(function () {
  $('#example').dataTable({
  "bProcessing": true,
  "bServerSide": true,
  "sAjaxSource": 'json.txt',
  "aoColumns": [
  { "mDataProp": "AccountNumber" },
  { "mDataProp": "ProjectID" },
  { "mDataProp": "SponsorName" },
  { "mDataProp": "CompanyName" },
  { "mDataProp": "Address" },
  { "mDataProp": "TotalkW" },
  { "mDataProp": "TotalkWh" },
  { "mDataProp": "IncentiveAmount" },
  { "mDataProp": "ApprovedDate" }
  ]
  });
  
  });
  
  
  And here is the contents of json.txt:
  
  { "aaData":[{"AccountNumber":"95264965302","ProjectID":325,"SponsorName":"Tanya Bell","CompanyName":"93335 Stage Store #697","Address":"1112 S Main Street Grove TX 74344","TotalkW":4.01698,"TotalkWh":17153.85,"IncentiveAmount":null,"ApprovedDate":null}]}
  
  
  The only thing I did was strip the text "callback(" from the front and the ending parentheses at the end of the jsonp response. If I leave it in, the table is unable to load the data.
• tjonsek Posts: 8Questions: 0Answers: 0

  April 2012

  If I connect straight to the source, this is the response we receive, but it errors out, staying on the "processing' label rather than loading:
  
  callback({"aaData":[{"AccountNumber":"95264965302","ProjectID":325,"SponsorName":"Tanya Bell","CompanyName":"93335 Stage Store #697","Address":"1112 S Main Street Grove TX 74344","TotalkW":4.01698,"TotalkWh":17153.85,"IncentiveAmount":null,"ApprovedDate":null},{"AccountNumber":"957-625-433-0-4","ProjectID":393,"SponsorName":"Marj Watts","CompanyName":"East Side Christian Church","Address":"1438 S. Indianapolis Tulsa OK 74112","TotalkW":8.8176,"TotalkWh":17506.944,"IncentiveAmount":null,"ApprovedDate":null},{"AccountNumber":"456456465465464","ProjectID":424,"SponsorName":"test test","CompanyName":"test","Address":"test test OK 73106","TotalkW":37.05,"TotalkWh":145635,"IncentiveAmount":null,"ApprovedDate":null},{"AccountNumber":"123123132131311","ProjectID":425,"SponsorName":"test test","CompanyName":"test","Address":"test test OK 73214","TotalkW":23.4,"TotalkWh":91980,"IncentiveAmount":null,"ApprovedDate":null}]});
• tjonsek Posts: 8Questions: 0Answers: 0

  April 2012

  I know I keep writing, but your demo was the first place I looked. It didn't work for us, though I think it has more to do with our response than anything.
• tjonsek Posts: 8Questions: 0Answers: 0

  April 2012

  One more thing - when we are in debug mode - using the code from your demo, the aoData var never has data in it. Yet, we are able to see the response and the json array sent in Firefox.
• tjonsek Posts: 8Questions: 0Answers: 0

  April 2012 edited April 2012

  Just for anyone who may have the same issue, we managed to get & consume the data for datatables with the following code:
  
  
  
  
  function callback(test) {
  $('#example').dataTable({
  "aaData": test.aaData,
  "aoColumns": [
  { "mDataProp": "AccountNumber" },
  { "mDataProp": "ProjectID" },
  { "mDataProp": "SponsorName" },
  { "mDataProp": "CompanyName" },
  { "mDataProp": "Address" },
  { "mDataProp": "TotalkW" },
  { "mDataProp": "TotalkWh" },
  { "mDataProp": "IncentiveAmount" },
  { "mDataProp": "ApprovedDate" }
  ]
  });
  };
  
  
  var doTest = function () {
  var script = document.createElement('script');
  script.setAttribute('type', 'text/javascript');
  script.setAttribute('src', 'http://localhost/completedProjects?programID=11&jsonp=callback');
  document.body.appendChild(script);
  };
  
  
  $(document).ready(function () {
  doTest();
  
  
  });
• zanedev Posts: 8Questions: 0Answers: 0

  November 2012 edited November 2012

  Thanks tjonsek, I think it's worth pointing out to people that this is a way to load the data cross domain first, then feed that into datatables. One tradeoff worth mentioning is that you won't get the built in processing notice while you are loading the data external from the datatable initialization etc so you have to handle that yourself. So if you just want to load the data via jsonp but continue to leave everything client side with datatables then this is the approach you want.
  
  The other way to load cross domain is to use the jsonp route built into datatables which requires server side processing to be turned on. If you want to hand off all the processing, sorting, filtering and so on then you can use the built in jsonp approach like illustrated here: http://datatables.net/release-datatables/examples/server_side/jsonp.html and the return data must match the format illustrated here: http://datatables.net/release-datatables/examples/data_sources/server_side.html