Unable to Load Complex JSON Object
Unable to Load Complex JSON Object
Hi,
Apologies for the beginner's question I am unable to get a complex JSON object to load.It is a JSON Object with many JSON arrays. I hope to use each array to load a different table using a different dataSrc option for each table/. I have gone through many examples but i am still stuck. Cut and paste sample from json file pasted at the bottom. My JS is as follows
<script>
$(document).ready(function() {
$('#example21').DataTable( {
"processing": true,
"ajax": "data/myhouse.json",
"dataSrc":"myhouse",
"columns": [
{ "data": "name" },
{ "data": "date" },
{ "data": "amount" },
{ "data": "address" }
]
} );
} );
</script>
My HTML is as follows
<table id="example21" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>name</th>
<th>date</th>
<th>amount</th>
<th>address</th>
</tr>
</thead>
<tfoot>
<tr>
<th>name</th>
<th>date</th>
<th>amount</th>
<th>address</th>
</tr>
</tfoot>
</table>
Any help much appreciated.
The ERROR is:
jquery.dataTables.js:3214 Uncaught TypeError: Cannot read property 'length' of undefined
at jquery.dataTables.js:3214
at Object.success (jquery.dataTables.js:2380)
at j (jquery-2.1.0.min.js:2)
at Object.fireWith [as resolveWith] (jquery-2.1.0.min.js:2)
at x (jquery-2.1.0.min.js:4)
at XMLHttpRequest.<anonymous> (jquery-2.1.0.min.js:4)
(anonymous) @ jquery.dataTables.js:3214
success @ jquery.dataTables.js:2380
j @ jquery-2.1.0.min.js:2
fireWith @ jquery-2.1.0.min.js:2
x @ jquery-2.1.0.min.js:4
(anonymous) @ jquery-2.1.0.min.js:4
My JSON object is of the following format
{
"myhouse": [
{
"name": "nameywamey",
"date": "2018-01-12",
"amount": 500,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-11",
"amount": 3000,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 3935,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 11,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-12",
"amount": 11,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 11,
"address": "mystreet"
}
],
"yourhouse": [
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 23,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 21,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 56,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 65,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 56,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-12 08:22:58",
"amount": 55,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 55,
"address": "mystreet"
}
],
"house11": [
{
"name": "nameywamey",
"date": "2018-01-12 16:09:09",
"amount": 55,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 37,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-11",
"amount": 48,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 11,
"address": "mystreet"
}
],
"house22": [
{
"name": "nameywamey",
"date": "2018-01-11",
"amount": 11,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-11",
"amount": 11,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 11,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 11,
"address": "mystreet"
}
],
"house51": [
{
"name": "nameywamey",
"date": "2018-01-11",
"amount": 12,
"address": "mystreet"
}
],
"house52": [
{
"name": "nameywamey",
"date": "2018-01-10",
"amount": 12,
"address": "mystreet"
},
{
"name": "nameywamey",
"date": "2018-01-12",
"amount": 89,
"address": "mystreet"
}
]
}
This question has an accepted answers - jump to answer
Answers
The problem is that the
ajax.dataSrc
config belongs in theajax
config. For example:The ease of returning all the data for each table and using just a subset might be ok depending on the size of the response. Depending on resource usage, etc you may want to just return the specific data for each table.
Kevin
Perfect!
Thank's a million for the quick response. Currently I can;t modify the server side so I'm stuck with it for now... the response size is small so it's bearable but this was my follow on question.
I did not know how to properly ask it until i knew how to do this one so i will post a separate question rather than combining two questions into this one.
Thanks again, it's much appreciated...