i have datatable that take it's sructure (columns,data,etc) from server side (php +mysql) because i want to make its column dynamic , but i can not see the datatable even if the response is correct , as a note : i use dt-1.11.4/datatables.min.js here is the response form server side :
{
"draw": "1",
"columns": [
"operation_code",
"operation_name",
"valuation_date",
"category_id",
"client",
"client_group",
"government",
"city",
"area",
"station",
"district",
"section",
"village",
"residential_area",
"street",
"address",
"meterPrice",
"totalPrice",
"sale",
"rent",
"licence"
],
"recordsTotal": 1,
"recordsFiltered": 1,
"data": [
[
"adad-PR-qew-qweqe",
" ad ad ad -",
"2021-04-02",
"131",
"tt ff rrr",
"بنوك",
"nothing",
"nothing",
"455.89",
"nothing",
"nothing",
"nothing",
"nothing",
"nothing",
"nothing",
"",
"33",
"44",
"1",
"0",
"6"
]
]
}
and here is the full code
<script type="text/javascript">
$(document).ready(function () {
var table;
var operation_code;
var operation_name;
table = $('#example2').DataTable({
scrollCollapse: true,
responsive: true,
"processing": true,
"serverSide": true,
"order": [],
rowId: 'staffId',
"ajax": {
"url": "<?php echo site_url(ADMIN_URL . '/advanced_search/ajax_list');?>",
"type": "POST",
"data": function (d) {
var operation_code = $('#operation_code').val();
var operation_name = $('#operation_name').val();
d.operation_code = operation_code;
d.operation_name = operation_name;
},
"dataSrc": function (json) {
// extract column titles from Ajax response
var columns = [];
if (json.columns) {
json.columns.forEach(function(column) {
columns.push({ "title": column, "data": column });
});
}
return {
"draw": json.draw,
"recordsTotal": json.recordsTotal,
"recordsFiltered": json.recordsFiltered,
"data": json.data,
"columns": columns // pass column definitions to DataTable
};
}
},
"language": {
"decimal": "",
"sInfo": "إظهار _START_ إلى _END_ من أصل _TOTAL_ عنصر",
"sInfoEmpty": "يعرض 0 إلى 0 من أصل 0 عنصر",
"sInfoFiltered": "(منتقاة من مجموع _MAX_ عنصر)",
"infoPostFix": "",
"thousands": ",",
"sLengthMenu": "أظهر _MENU_ عنصر",
"loadingRecords": "جاري التحميل...",
"processing": "جاري التنفيذ...",
"search": "بحث للكل ",
"zeroRecords": "لا توجد بيانات مطابقة لبحثك",
"paginate": {
"first": "الأول",
"last": "الأخير",
"next": "التالي",
"previous": "السابق"
},
"aria": {
"sortAscending": ": activate to sort column ascending",
"sortDescending": ": activate to sort column descending"
}
},
"stripeClasses": ['', '']
});
$(".frm_search").click(function () {
table.ajax.reload();
});
});
</script>