Pingo Pongo Pingo Pongo - 2 months ago 22
jQuery Question

Datatable TypeError: f is undefined

-------- Js Code -------

$('#large-page-data').DataTable({
"processing":true,
"serverSide":true,
"ajax": 'getlargedataTables',
});


-------- Data -------

[{"Name":"Janet Andor","Term":"First Term","Date":"2016-09-26","Class":"J.H.S 1","Subject":"ENGLISH LANGUAGE","Exam":"CLASS WORK","Marks":"20"},{"Name":"Henry Kumi Kumson","Term":"First Term","Date":"2016-09-26","Class":"J.H.S 1","Subject":"ENGLISH LANGUAGE","Exam":"CLASS WORK","Marks":"24"},
{"Name":"Jones Alonso","Term":"First Term","Date":"2016-09-26","Class":"J.H.S 1","Subject":"ENGLISH LANGUAGE","Exam":"CLASS WORK","Marks":"27"},{"Name":"Kingsley Offei Kumi","Term":"First Term","Date":"2016-09-26","Class":"J.H.S 1","Subject":"ENGLISH LANGUAGE","Exam":"CLASS WORK","Marks":"21"},
{"Name":"Mary Anderson","Term":"First Term","Date":"2016-09-26","Class":"J.H.S 1","Subject":"ENGLISH LANGUAGE","Exam":"CLASS WORK","Marks":"25"},{"Name":"Mary Boatemaa Duodu","Term":"First Term","Date":"2016-09-26","Class":"J.H.S 1","Subject":"ENGLISH LANGUAGE","Exam":"CLASS WORK","Marks":"22"}]


-------- Table -------

<table class="table table-hover table-striped table-bordered" id="large-page-data">
<thead>
<tr>
<th>NAME</th>
<th>TERM</th>
<th>DATE</th>
<th>CLASS</th>
<th>EXAM</th>
<th>SUBJECT</th>
<th>MARKS</th>
</tr>
</thead>
</table>


I would appreciate if someone can point me to where i went wrong

Answer

Your JSON data format is wrong. It should be like this:

{
data: [
    ["Janet Andor","First Term","2016-09-26","J.H.S 1","ENGLISH LANGUAGE","CLASS WORK","20"],
    ["Janet Andor","First Term","2016-09-26","J.H.S 1","ENGLISH LANGUAGE","CLASS WORK","20"],
    ["Janet Andor","First Term","2016-09-26","J.H.S 1","ENGLISH LANGUAGE","CLASS WORK","20"],
    ["Janet Andor","First Term","2016-09-26","J.H.S 1","ENGLISH LANGUAGE","CLASS WORK","20"]
]}

You can refer to this datatable example: https://datatables.net/examples/data_sources/ajax.html