javascript - DataTable not displaying AJAX JSON data
200
DataTable not displaying AJAX JSON data
I'm working on a simple project with the help of DataTable to display POST data using AJAX. The data shows but lists all the records without paginating. The JSON data is as per the DataTable requirements and other settings as well in Jquery.
Any help in this will be highly appreciated. The code is given below
HTML
<table id="dataTable" class="display" style="width:100%">
<thead>
<tr>
<th>ID</th>
<th>Qualification</th>
</tr>
</thead>
<tfoot>
<tr>
<th>ID</th>
<th>Qualification</th>
</tr>
</tfoot>
</table>
Jquery
$(document).ready(function () {
$('#dataTable').DataTable({
"searching": false,
info: false,
"pageLength": 5,
"lengthMenu": [[5, 10, 20, -1], [5, 10, 20, "All"]],
"processing": true,
"serverSide": true,
"ajax": {
"url": "scripts/post.php",
"type": "POST",
"dataType": "json",
"dataSrc": "data",
"data": {
table: 'tbl_qualification'
},
"success": function (data) {
console.log(data);
}
},
"columns": [
{"data": "pk_int_qualificationID"},
{"data": "txt_qualificationName"}
]
})
})
Server-side (post.php)
$table=$_POST['table'];
$result=ConnectSQL::GetQuick($table,array(),array());
$result['recordsTotal']=$result['count'];
unset($result['count']);
$result['data']=$result['rows'];
unset($result['rows']);
print_r(json_encode($result));
return json_encode($result);
JSON
{
"recordsTotal": 27,
"data": [{
"pk_int_qualificationID": "1",
"txt_qualificationName": "Doctor of Medicine"
}, {
"pk_int_qualificationID": "2",
"txt_qualificationName": "Internship"
}, {
"pk_int_qualificationID": "3",
"txt_qualificationName": "OMSB Speciality"
}, {
"pk_int_qualificationID": "4",
"txt_qualificationName": "OMSB Compelition"
}, {
"pk_int_qualificationID": "5",
"txt_qualificationName": "IELTS"
}, {
"pk_int_qualificationID": "6",
"txt_qualificationName": "abc"
}, {
"pk_int_qualificationID": "7",
"txt_qualificationName": "abc"
}, {
"pk_int_qualificationID": "8",
"txt_qualificationName": "abc"
}, {
"pk_int_qualificationID": "9",
"txt_qualificationName": "abc"
}, {
"pk_int_qualificationID": "10",
"txt_qualificationName": "amir"
}, {
"pk_int_qualificationID": "11",
"txt_qualificationName": "Sameer"
}, {
"pk_int_qualificationID": "12",
"txt_qualificationName": "amir1234"
}, {
"pk_int_qualificationID": "13",
"txt_qualificationName": "Sameer5"
}, {
"pk_int_qualificationID": "14",
"txt_qualificationName": "Amir12346"
}, {
"pk_int_qualificationID": "15",
"txt_qualificationName": "Zubair"
}, {
"pk_int_qualificationID": "16",
"txt_qualificationName": "dd"
}, {
"pk_int_qualificationID": "17",
"txt_qualificationName": "dsd1"
}, {
"pk_int_qualificationID": "18",
"txt_qualificationName": "abc1"
}, {
"pk_int_qualificationID": "19",
"txt_qualificationName": "Abc123"
}, {
"pk_int_qualificationID": "20",
"txt_qualificationName": "Sameer"
}, {
"pk_int_qualificationID": "21",
"txt_qualificationName": "Sameer"
}, {
"pk_int_qualificationID": "22",
"txt_qualificationName": "abc145"
}, {
"pk_int_qualificationID": "23",
"txt_qualificationName": "abc"
}, {
"pk_int_qualificationID": "24",
"txt_qualificationName": "abc123"
}, {
"pk_int_qualificationID": "25",
"txt_qualificationName": "Sameer123"
}, {
"pk_int_qualificationID": "26",
"txt_qualificationName": "dasda"
}, {
"pk_int_qualificationID": "29",
"txt_qualificationName": "abc14567"
}]
}
Answer
Solution:
Set
serverside
tofalse
(or remove it), or, add paging and sorting information to your ajax request.Answer
Solution:
Try adding
"paging" : true
. Also, you should put quotations around 'info':"info" : false
Reference