Issues when trying to get DataTables to load data from an external source

MrThomas

I have got a php file that returns a JSON that contains over 50,000 items.I am trying to set the AjaxSource to the php file by setting the URL
under the option "sAjaxSource" but keep getting the json.aaData is UNDEFINED../js/jquery.dataTables.min.js. Can some one please help? The items.php has got echo json_encode($dataarrary) at the end to return a JSON
The code

[code]
$('#tbData').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": 'items.php'
} );

[/code]

hybris

has your json a root property "aaData"?

{
aaData[
[row...]
[row..[
]
}

if you have aaData under another name, you can set its position with sAjaxDataProp that has the default value "aaData".

MrThomas

My JSON has not got a root property called aaData. I have this line in the items.PHP

[code]json_encode($dataarrary)[/code]

If I was to load the php file in the browser it will give me a valid JSON like this

[code]
[
{"itemid":"13907","name":"Item 1","price":"20","currency":"pounds"},
{"itemid":"13904","name":"Item 2","price":"40","currency":"pounds"},
{"itemid":"13902","name":"Item 3","price":"60","currency":"pounds"}
]
[/code]

How do I fix it?

hybris

you need of aaData key, but you can choose the name you want.
your array have to be:
$dataarray["aaData"][] = array(data row)
$dataarray["aaData"][] = array(data row)
$dataarray["aaData"][] = array(data row)

return json_encode($dataarrary)

if you change the default 'aaData', then you need to set sAjaxDataProp property to the name you are using.

Example of Json:
{"aaData":[["Trident","Internet Explorer 4.0","Win 95+",4,"X"],["Trident3","Mozr 5.0","Win 95+",5,"X"],["Trident3","Mozr 5.0","Win 95+",5,"X"],["Trident3","Mozr 5.0","Win 95+",5,"X"]]}

Then, if you use key=>value in your json data (itemid => 13907) you should be need to map your columns with the aoColumns / mDataProp
http://datatables.net/usage/columns#mDataProp

MrThomas

Thanks for your help so far,my JSON looks like this now:

[code]
{
"aaData":[
{"itemid":"13907","name":"Item 1","price":"20","currency":"pounds"},
{"itemid":"13904","name":"Item 2","price":"40","currency":"pounds"},
{"itemid":"13902","name":"Item 3","price":"60","currency":"pounds"}
]
}
[/code]

I am getting this warning for every row "Warning - added data does not match known number of columns"

allan

> you need of aaData key, but you can choose the name you want.

By default, but you can change that using sAjaxDataProp . If you set that option to an empty string, then it would take the array without being a property of an object :-)

> I am getting this warning for every row "Warning - added data does not match known number of columns"

If you are returning objects, then you need to tell DataTables what property to use for each object - otherwise how will it know which one to put in each column? :-). To do this use mDataProp - there is a detailed description here: http://datatables.net/blog/Extended_data_source_options_with_DataTables .

If that doesn't solve the issue, please run your table through the debugger ( http://debug.datatables.net ) and post the debug code here.

Allan

MrThomas

thanks allan it worked