Basic Noob Question-object arrays and datatables

RobSmart

Hi all,

I've got a page that is displaying an OpenLayers map with some custom overlays on it. A user can type in a postcode, and hit a search button. This then calls a webservice via javascript. The returned obj is a JSON string contain various bits of information. The JSON string is deserialized into an object array.

Now I also want to take that object arrau and display some of the values in a datatable.

How do I do it???

I'll admit that I'm very new to this stuff!

I've been trying all day using aoColumns, aoColumnDefs even manually adding the rows doesn't work. So I figured I must be missing something. Please help someone as I'm not going to have much hair left at this rate!!

at the moment I'm just trying to add the rows manually, but I get the same error I get when I use the built in functions- Requested unknown parameter '1' from the data source for row 0

The code I'm using to manually add the rows is:

$(document).ready(function() {$('#table_id').dataTable();});
for (i in objs) {

$('#table_id').dataTable().fnAddData([objs[i].Address, objs[i].Anchor, objs[i].Edited, objs[i].ID ]);
}

html table is:
Address Anchor Edited ID

example of json before deserilized:

[{"ID":"21126222","Address":"40 Elgar Road READING RG20BL","lat":-0.972930649430636,"lon":51.4474793243505,"Anchor":true,"Edited":true},{"ID":"21126223","Address":"42 Elgar Road READING RG20BL","lat":-0.972925149441118,"lon":51.4474409130523,"Anchor":false,"Edited":false}]

The JSON is formed on by the webservice by serializing a .net objet that contains these variables using the JSON.net libary.

I know that the JSON deseralizes into objects correctly because I can and do access the values from other parts of my page.

Any ideas please?????

Thanks,

Rob Smart

rgvcorley

Rob,

"Requested unknown parameter '1' from the data source for row 0" means that the data being supplied doesn't match the column count for the table you're rendering.

Your JSON is in the wrong format, have a look at this example:-
http://datatables.net/release-datatables/examples/data_sources/ajax.html

The JSON returned needs to be an object containing a single property called 'aaData' which should contain an array of arrays. For example your JSON should be something like:-

[code]
{ "aaData": [
["21126222","40 Elgar Road READING RG20BL",-0.972930649430636,51.4474793243505,true,true],
["21126222","40 Elgar Road READING RG20BL",-0.972930649430636,51.4474793243505,true,true],
] }
[/code]

If you can't supply javascript arrays and must use objects then that is also possible:-
http://www.datatables.net/release-datatables/examples/server_side/object_data.html

allan

Actually, DataTables can use just a plain array - it doesn't by default, but if you set the sAjaxDataProp option to be an empty string, DataTables indeed just use a plain array. Indeed sAjaxDataProp can be used to alter the aaData default to whatever is required, but an empty string is a special case for plain old arrays.

Then using mDataProp you can ready in your JSON object data.

Allan

RobSmart

Thanks for the replies guys. I'm actually trying to use an object array, not the Json directly. so if I log the output to firebug it looks like this:

[Object { ID=

"6580834"

, Address=

"12 Masson Hill View MATLOCK DE43SG"

, lat=

-1.57018393677743

, more...}, Object { ID=

"20116479"

, Address=

"26 Thanckes Drive TORPOINT PL112JN"

, lat=

-4.20438858452378

, more...}, Object { ID=

"16299315"

, Address=

"1 Ash Grove LONDON N103UL"

, lat=

-0.14465577483807

, more...}, Object { ID=

"16719567"

, Address=

"17 Belsay Grove BEDLINGTON NE225YU"

, lat=

-1.57585425991661

, more...}, Object { ID=

"2599692"

, Address=

"16 Nuthurst Place BRIGHTON BN25LR"

, lat=

-0.103245575325303

, more...},


I'm now trying to use this syntax:

function Button1_onclick()
{

$(document).ready(function() { $('#table_id').dataTable({ "aaData": [json], "sAjaxDataProp": "",
"aoColumns": [
{"sTitle": "Address", "sDefaultContent": " ", "mDataProp": "Address" },
{ "sTitle": "Anchor", "sDefaultContent": " ", "mDataProp": "Anchor" },
{ "sTitle": "Edited", "sDefaultContent": " ", "mDataProp": "Edited" },
{ "sTitle": "ID", "sDefaultContent": " ", "mDataProp": "ID"}]
});
});


}

Using this I don't get an error, but I don't get anything in the table either, just blank.

In firebug I can see the objects are all in the array with the correct names.

Am I missing something obvious?

Thanks,

Rob

allan

That looks fine to me - but you need to use sAjaxDataProp as I mentioned above.

Allan

RobSmart

Hi Allan, I've included sAjaxDataprop as an empty string as you said. Does this need to be done for each column?

or should it be sAjaxDataprop:"object.inner"

Thanks,

Rob

RobSmart

sAjaxDataprop:"object.inner"

or

sAjaxDataprop:"Object"

or

sAjaxDataprop:"Data"

doesn't work, just comes back with a blank table again.

RobSmart

Any help would be greatly appreciated!!