Getting 'Added data (size undefined) does not match' error with Valid JSON, col size does match

Agaken

I searched and saw (many) posts from people with similar issues - but I can't find any that are close enough to get a solution to work for me.

I'm using server-side paging, and have made sure that my columns match up and that I'm getting back valid JSON.


My HTML:
[code]



data 1
data 2
data 3
data 4
data 5
data 6
data 7
data 8
data 9
data 10
data 11
data 12
data 13




[/code]

I have also tried this without the tags (just an empty table, using mDataProp to write in the headings. I left this code - commented out- in the JS below).


My JS:
[code]
var saleHistoryTable;

saleHistoryTable = $("#salesHistory").dataTable({
"bJQueryUI": true,
"bDestroy": true,
"bProcessing": true,
"bServerSide": true,

/*
"aoColumns": [
{ "mDataProp": "Id", "sTitle": "Sale Id", "bSortable": true, "bSearchable": true },
{ "mDataProp": "SaleDate", "sTitle": "Sale Date", "bSortable": true, "bSearchable": true },
{ "mDataProp": "SaleType", "sTitle": "Sale Type Id", "bSortable": true, "bSearchable": true },
{ "mDataProp": "SaleTypeName", "sTitle": "Sale Type", "bSortable": true, "bSearchable": true },
{ "mDataProp": "CustomerId", "sTitle": "Customer Id", "bSortable": true, "bSearchable": true },
{ "mDataProp": "CustomerName", "sTitle": "Customer", "bSortable": true, "bSearchable": true },
{ "mDataProp": "EventId", "sTitle": "Event Id", "bSortable": true, "bSearchable": true },
{ "mDataProp": "EventName", "sTitle": "Event Name", "bSortable": true, "bSearchable": true },
{ "mDataProp": "EventDate", "sTitle": "Event Date", "bSortable": true, "bSearchable": true },
{ "mDataProp": "BrokerId", "sTitle": "Broker Id", "bSortable": true, "bSearchable": true },
{ "mDataProp": "BrokerName", "sTitle": "Broker", "bSortable": true, "bSearchable": true },
{ "mDataProp": "Invoice", "sTitle": "invoice", "bSortable": true, "bSearchable": true },
{ "mDataProp": "PurchaseOrders", "sTitle": "po", "bSortable": true, "bSearchable": true }
],
*/
"aoColumns": [null, null, null, null, null, null, null, null, null, null, null, null, null],

"sAjaxSource": "/data/sales/websales/history/" + orderTypeString,
"fnServerData": function (sSource, aoData, fnCallback) {

var OBJaoData = { dataaction: aoData };
$.ajax({
abortOnRetry: true,
type: "POST",
url: sSource,
contentType: "application/json; charset=UTF-8",
dataType: "json",
data: JSON.stringify(OBJaoData),
success: function (aoData) {
alert('success');
fnCallback(aoData);
},

error: function (XMLHttpRequest, textStatus, errorThrown) {
alert('ajax failed');
}
});
}
});
[/code]

And finally, the JSON that is being returned:
[code]
{
"iTotalRecords": 1,
"iTotalDisplayRecords": 1,
"sColumns": "Id, SaleDate, SaleType, SaleTypeName, CustomerId, CustomerName, EventId, EventName, EventDate, BrokerId, BrokerName, Invoice, PurchaseOrders",
"aaData": [
{
"BrokerId": 999999,
"BrokerName": "Some Broker",
"CustomerId": 999999,
"CustomerName": "Some Name",
"EventDate": "11/06/2011 12:00PM",
"EventId": 999999,
"EventName": "Some Event",
"Id": 999999,
"Invoice": 0,
"PurchaseOrders": null,
"SaleDate": "12/6/2011 10:37:31 AM",
"SaleType": 0,
"SaleTypeName": "Remote"
},
],
"sEcho": 1
}
[/code]



I've tried everything I can think of to get this to work, but I'm totally out of ideas, so any help would be very appreciated!

allan

1. Comment your first aoColumns back in - you must define mDataProp for each column - otherwise how is DataTables to know what property to apply to each column!?

2. Comment out the second aoColumns with the nulls, since that would override the first.

The rest look alike it should work to me. If it doesn't please post a link.

Allan

Agaken

Thanks so much for getting back to me. I put the mDataProp code back in place and removed the nulls and I'm still getting the same error.

I'm working to get a link that you'll be able to take a look at (its running on a non-public accessible server right now), but I have noticed something that might shed some light on this.

In a similar project I've worked on with a very similar setup when i make my request for data it is including the following for each column that has been defined in the aoColumns:

[code]
{"name":"mDataProp_0","value":"Venue_ID"},
[/code]

This is missing from the request that code in my original post is sending.


(I'll keep working to get a link for you, but saw this and realized it might point to an obvious issue.)

allan

Just a thought - are you using DataTables 1.8? mDataProp was a new feature in the 1.8 series - it sounds like you might be using an earlier version.

Allan

Agaken

Ahh good catch - I actually was using a 1.7. Adding 1.8.2 lines the requests now have the mDataProp, but unfortunately, I'm still getting the same number of columns error.

(still working towards a link you can take a look at - thank you so much for your help and patience!)